/* CSS Document */

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

    Body
	
**********************/


body {
	margin: 0;
	padding: 0;
	background-color: #12567A;
	background-image: url(../Images/CorporateImages/body_bg.jpg);
	background-position: top center;
	background-repeat: repeat-y;
	font-family: Times, serif;
	font-size: 14px;
	text-align: justify;
	color: #666666;
	line-height: 20px;
}

body#prospective_broker {
	margin: 0;
	padding: 0;
	background-color: #12567A;
	background-image: url(../Images/CorporateImages/body_bg.jpg);
	background-position: top center;
	background-repeat: repeat-y;
	font-family: Times, serif;
	font-size: 12px;
	text-align: justify;
	color: #666666;
	line-height: 20px;
}


#body_frame {
	margin: 0 auto 0 auto;
	padding: 0 0 10px 0;
	width: 940px;
	height: 800px;
	background-image: url(../Images/CorporateImages/body_frame.jpg);
	background-position: top center;
	background-repeat: repeat-y;
}

body#prospective_broker #body_frame {
	margin: 0 auto 0 auto;
	padding: 0 0 10px 0;
	width: 940px;
	height: auto;
	background-image: url(../Images/CorporateImages/body_frame.jpg);
	background-position: top center;
	background-repeat: repeat-y;
}

body#newAd #body_frame {
	height: 820px;
}

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

    General Stuff 
	
**********************/


a, a:active, a:link, a:visited {
	color: #0079C0;
	text-decoration: underline;
	font-weight: 600;
	font-size: 12px;
}

.contactUs p {
	margin: 0px 0 8px 0;
}

a:hover {
	color: #5D95BF;

}


.important_message {
	display: block;
	margin: 0 20px 10px 20px;
	padding: 14px 30px 14px 30px;
	border: #FF0000 none 1px;
	background-color: #EFF8FF;
	text-align: left;
	font-weight: 600;
	color: #0079C0;
	border-top: #0079C0 dotted 1px;
	border-bottom: #0079C0 dotted 1px;
}

.blue {	color: #0079C0;}

.hidden {	display: none;}

p {	margin: 0 0 23px 0;}

.align_center { text-align: center; }

.align_left { text-align: left; }

.align_right { text-align: right; }

.clear_left{    clear: left;}

.clear_right{    clear: right;}

.clear_both{    clear: both;}

.extender {
	clear: both;
	display: block;
	height: 1px;
}

.Attention {
    font-size: 13px;
    font-weight: bold;
    color: #FF000A;
}

.bg_lightBlue {
    background-color: #8BB4D4;
}
.outline {	border: solid 1px red;}

.outlineY {	border: solid 1px yellow;}

.outlineG {	border: solid 1px green;}

.outlineB {	border: solid 1px blue;}

.block {
	display: block;
	margin: 6px 0 0 0;
	padding: 0;
}

.block h1, .block h2, .block h3, .block h4, .block h5{
	display: block; 
	margin: 0; 
	padding: 5px 10px 2px 10px; 
	color: #FFFFFF; 
	background-color: #8BB4D4;
}

.block table {
	display: block;
	margin: 6px 0 6px 0;
}

.block table tr td {
	vertical-align: top;
}

.ver_top{ vertical-align: top;}

.ver_middle{	vertical-align: middle;}

.ver_bottom{	vertical-align: bottom;}

.wide {
	display: block;
	clear: both;
}

.thin {
	float: left;
	margin: 5px;
	padding: 0;
}

.float_right {	float: right;}

.float_left {	float: left;}

.bold {	font-weight: bold;}

.warning {
	color: #FF0000;
	font-weight: bold;
}

.dark_blue { color: #3F647F}

.light_blue { color: #8BB4D4}


/*  Use this class to place a link on a block title aligned to the right - Diego */

a.title_link_right_align {
	color: #3F647F;
	text-decoration: underline;
	font-weight: bold;
	font-size: 12px;
	float: right;
	margin: -19px 10px 0 0;
}

a.title_link_right_align:hover {
	color: #FFFFFF;
}

.title_btn_right_align {
	color: #3F647F;
	font-weight: bold;
	font-size: 12px;
	float: right;
	margin: -19px 10px 0 0;
}

.title_btn_right_align:hover {
	color: #FFFFFF;
}

/* end - note */


.Submit_Final_btn {
	margin: 0 5px 0 0;
	padding: 2px;
	background-color: #3F647F;
	border: solid #FFFFFF 1px;
	font-size: 8pt;
	font-weight: bold;
	color: #FFFFFF;
	cursor: pointer;
}

.phone_table table, .phone_table table tr, .phone_table table tr td{
    margin: 0;
    padding: 0;
}

body#prospective_broker input{
    font-size: 12px;
}

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

    Header 
	
**********************/


#header {
	margin: 0;
	padding: 46px 0 0 0;
	background-image: url(../Images/CorporateImages/top_header.jpg);
	background-position: top;
	background-repeat: no-repeat;
}

body#prospective_broker #Header {
	margin: 0;
	padding: 46px 0 0 50px;
	background-image: url(../Images/CorporateImages/top_header.jpg);
	background-position: top;
	background-repeat: no-repeat;
	text-align: center;
}


#banner {
	margin: 0 auto 0 auto;
	padding: 0;
	width: 848px;
	height: 182px;
	border: #BFBFBF solid 1px;
	text-align: center;
	background-image: url(../Images/CorporateImages/sampleHeader.jpg);
	background-position: top;
	background-repeat: no-repeat;
	

}

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

    Navigation
	
**********************/

#navigation {
	display: block;
	height: 28px;
	margin: 0 5px 0 0;
}

body#newAd #navigation {
	display: block;
	height: 28px;
	margin: 15px 5px 0 0;
}



#navigation ul{
	padding: 0;
	margin: 0;
	list-style: none;
}

#navigation ul li{
	float: left;
}

#nav_home a:link, #nav_home a:visited{
	display: block;
	width: 88px;
	height: 28px;
	margin: 0 5px 0 0;
	background-image: url(../Images/CorporateImages/Navigation/tab_Home.gif);
	background-position: top;
	background-repeat: no-repeat;
}

#nav_home a:hover{
	background-position: 0 -28px;
}

#nav_home.active_tab a{
	background-position: 0 -56px;
}


#nav_aboutUs a:link, #nav_aboutUs a:visited{
	display: block;
	width: 88px;
	height: 28px;
	margin: 0 5px 0 0;
	background-image: url(../Images/CorporateImages/Navigation/tab_aboutUs.gif);
	background-position: top;
	background-repeat: no-repeat;
}


#nav_aboutUs a:hover{
	background-position: 0 -28px;
}

#nav_aboutUs.active_tab a{
	background-position: 0 -56px;
}


#nav_services a:link, #nav_services a:visited{
	display: block;
	width: 88px;
	height: 28px;
	margin: 0 5px 0 0;
	background-image: url(../Images/CorporateImages/Navigation/tab_services.gif);
	background-position: top;
	background-repeat: no-repeat;
}


#nav_services a:hover{
	background-position: 0 -28px;
}

#nav_services.active_tab a{
	background-position: 0 -56px;
}


#nav_careers a:link, #nav_careers a:visited{
	display: block;
	width: 88px;
	height: 28px;
	margin: 0 5px 0 0;
	background-image: url(../Images/CorporateImages/Navigation/tab_careers.gif);
	background-position: top;
	background-repeat: no-repeat;
}

#nav_careers a:hover{
	background-position: 0 -28px;
}

#nav_careers.active_tab a{
	background-position: 0 -56px;
}


#nav_contactUs a:link, #nav_contactUs a:visited{
	display: block;
	width: 88px;
	height: 28px;
	margin: 0 5px 0 0;
	background-image: url(../Images/CorporateImages/Navigation/tab_contactUs.gif);
	background-position: top;
	background-repeat: no-repeat;
}

#nav_contactUs a:hover{
	background-position: 0 -28px;
}

#nav_contactUs.active_tab a{
	background-position: 0 -56px;
}


#nav_newAd a:link, #nav_newAd a:visited{
	display: block;
	width: 88px;
	height: 28px;
	margin: 0 5px 0 0;
	background-image: url(../Images/CorporateImages/Navigation/tab_newAd.gif);
	background-position: top;
	background-repeat: no-repeat;
}

#nav_newAd a:hover{
	background-position: 0 -28px;
}

#nav_newAd.active_tab a{
	background-position: 0 -56px;
}


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

    Corpus 
	
**********************/

#corpus{
	margin: 20px auto 5px auto;
	width: 848px;
}

body#newAd #corpus{
	margin: 5px auto 5px auto;
	width: 848px;
}




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

    Accordion Pannel
	
**********************/

/* SpryAccordion.css - version 0.4 - Spry Pre-Release 1.6 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main Accordion container. For our default style,
 * we draw borders on the left, right, and bottom. The top border of the Accordion
 * will be rendered by the first AccordionPanelTab which never moves.
 *
 * If you want to constrain the width of the Accordion widget, set a width on
 * the Accordion container. By default, our accordion expands horizontally to fill
 * up available space.
 *
 * The name of the class ("Accordion") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * Accordion container.
 */
 
 /********************

    Accordion Pannel Main 
	
**********************/
 
 #Accordion1 span {
}
 
.Accordion {
	border-left: solid 1px #BFBFBF;
	border-right: solid 1px #BFBFBF;
	border-bottom: solid 1px #BFBFBF;
	overflow: hidden;
}

/* This is the selector for the AccordionPanel container which houses the
 * panel tab and a panel content area. It doesn't render visually, but we
 * make sure that it has zero margin and padding.
 *
 * The name of the class ("AccordionPanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel container.
*/
.AccordionPanel {
	margin: 0px;
	padding: 0px;
}

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

    Accordion Pannel Content
	
**********************/



.AccordionPanelContent {
	overflow: auto;
	margin: 0px;
	padding: 0px;
	background-color: #E0E9F0;
}


.AccordionPanelContent_frame{
	margin: 10px 10px 10px 15px;
	padding: 10px;
	width: 500px;
	height: 455px;
	border: #BFBFBF solid 1px;
	background-color: #FFFFFF;
}

body#newAd .AccordionPanelContent_frame{
	height: 475px;
}



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

    Accordion Pannel Content Right Column
	
**********************/


.content_panel_right_column {
	float: right;
	margin: 15px 20px 15px 0;
	width: 250px;
	text-align: left;
}

.content_panel_right_column img {
	border: #BFBFBF solid 1px;
	padding: 10px;
	background-color: #FFFFFF;
}

.content_panel_right_column a:hover img {
	border: #5D95BF solid 2px;
}

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

    Accordion Pannel Content Right Column Quote
	
**********************/

.content_panel_right_column  q {
	display: block;
	margin: 20px 0 20px 0;
	padding: 14px 10px 14px 0;
	border: #FF0000 none 1px;
	text-align: left;
	font-weight: bold;
	color: #0079C0;
	border-top: #0079C0 dotted 1px;
	border-bottom: #0079C0 dotted 1px;
}
 
 

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

    Copy Right
		
**********************/

.copyRight {
	padding: 10px 0 0 0;
	width: 100%;
	text-align: center;
	font-variant: small-caps;
	font-weight: 600;
	font-size: 12px;
	color: #0079C0;
}



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

    Footer 
	
**********************/

#footer {
	margin: 0 auto 0 auto;
	padding: 0;
	width: 940px;
}



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

    Flash Object
	
**********************/


#flashcontent_header p {
	padding: 5px 10px 5px 10px;
	background-color: #999999;
	text-align: center;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: 500;
	text-transform: uppercase; 
}

#flashcontent_header a {
	color: #99CCFF;
}

#flashcontent_footer p {
	width: 100%;
	padding: 5px 10px 5px 10px;
	background-color: #999999;
	text-align: center;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: 500;
	text-transform: uppercase; 
}

#flashcontent_footer a {
	color: #99CCFF;
}


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

    Login Btn
	
**********************/

.login_button a {
	display: block;
	width: 140px;
	height: 71px;
	background-image: url(../Images/CorporateImages/login_button.jpg);
	background-position: top left;
	background-repeat: no-repeat;
}

.login_button a:hover {
	background-position: 0 -71px;
}













/* SprySlidingPanels.css - version 0.1 - Spry Pre-Release 1.6 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main SlidingPanels container. This selector
 * defines the width and height of the view port for the widget. Note that
 * this selector does not set the overflow property since that is done programatically
 * by the widget. Setting the overflow property programatically ensures that
 * the contens of the widget will be fully visible should JavaScript be disabled
 * in the browser.
 *
 * If you want to constrain the width of the SlidingPanels widget, set a width on
 * the SlidingPanels container. By default, our sliding panels widget expands
 * horizontally to fill up available space.
 *
 * The SlidingPanels container is positioned relative so that content inside it
 * can be positioned relative to its upper left corner.
 *
 * Avoid placing any CSS border or padding properties on the SlidingPanels container
 * as they can affect the proper positioning and sliding animations of the contents
 * inside the container.
 *
 * The name of the class ("SlidingPanels") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * SlidingPanels container.
 */
.SlidingPanels {
	position: relative;
	width: 100%;
	height: 500px;
	padding: 0px;
	border: none;
}

/* This is the selector for the container that holds all of the content panels
 * for the widget. The SlidingPanelsContentGroup container is what gets programtically
 * positioned to create the slide animation. It is also what governs the layout of
 * the panels.
 *
 * By default, the width of the container is the same as its parent, the SlidingPanels
 * container.
 *
 * You can make the panels within the SlidingPanelsContentGroup container layout
 * horizontally by giving the SlidingPanelsContentGroup container a width that is as wide
 * or larget than the sum of the widths of all of the content panels, and then floating
 * the content panels inside the SlidingPanelsContentGroup container so they all appear
 * on the same line. You may also need to float the SlidingPanels and SlidingPanelsContentGroup
 * containers to insure that none of the content panels "leak" outside of the widget.
 *
 * Avoid placing any CSS border, margin, or padding properties on the SlidingPanels
 * container as they can affect the proper positioning and sliding animations of the
 * the container within the widget.
 *
 * The name of the class ("SlidingPanelsContentGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you want to style the
 * SlidingPanelsContentGroup container.
 */
.SlidingPanelsContentGroup {
	position: relative;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: none;
}


/* This is the selector for the container that holds content for a given panel. In our
 * default style implementation, the dimensions of each content panel exactly match the
 * dimensions of the view port (SlidingPanels) container. This ensures that only one
 * panel ever shows within the view port.
 *
 * Avoid placing any CSS border, margin, or padding properties on the SlidingPanels
 * container as they can affect the proper positioning and sliding animations of the
 * the panel within the widget. You can place border, margins and padding on any content
 * *inside* the content panel.
 *
 * The name of the class ("SlidingPanelsContent") used in this selector is not
 * necessary to make the widget function. You can use any class name you want to style the
 * SlidingPanelsContent container.
 */
.SlidingPanelsContent {
	width: 100%;
	height: 400px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	border: none;
}

/* The class used in this selector is programatically added to the SlidingPanels container
 * anytime we are animating between panels. This rule makes sure that *all* content inside
 * the widget is overflow:none to avoid a rendering glitch that occurs in FireFox 1.5 whenever
 * there is an element inside the widget that displays a scrollbar.
 *
 * The class is automatically removed once the animation has stopped so that the overflow
 * properties of the content inside the widget should be restored.
 */
.SlidingPanelsAnimating * {
	overflow: hidden !important;
}

/* The class used in this selector is programatically added to the SlindingPanelsContent
 * container that is currently visible in the view port. The class is automatically removed
 * when the widget switches to a different panel.
 */
.SlidingPanelsCurrentPanel {
}

/* The class used in this selector is programatically added to the SlidingPanels container
 * anytime the SlidingPanels container is given focus. The class is automatically removed
 * once the SlidingPanels container loses focus.
 */
.SlidingPanelsFocused {
}



.SlidingPanels {
	float: left;
	background-color: #E0E9F0;
	border: #BFBFBF solid 1px;
}
.SlidingPanelsContentGroup {
	float: left;
	width: 6000px;
}
.SlidingPanelsContent {
	float: left;
	width: 850px;
	height: 800px;
}


body#newAd .SlidingPanels {
	height: 520px;
	margin: 0 0 5px 0;
}