﻿/*--- Process template CSS - Ideally this is to be external---*/

    /* -- buy process forms -- */
	
    table.ProcessTable {  width:100%}
        table.ProcessTable td { font-size:1.2em ;padding:5px 0 5px 15px ;}
        table.ProcessTable tbody td { background:#f9f9f9; border-top:dotted 1px #666}
        table.ProcessTable tfoot td { border-top:solid 1px #d6d6d6; border-bottom:solid 1px #d6d6d6}
            #ContentLeft table.ProcessTable a { color:#444 ; text-decoration:underline}
        table.ProcessTable th {background:#555 ; color:#fff ;font-size:1.2em ; padding:5px 0 5px 15px ; margin-top:0}
        table.ProcessTable tfoot td {background:#eaeaea; font-weight:bold}

    /*--progress bar ul--*/


    #Mid .Progress {background:url(/images/btn/buy_process/ul_bg.gif) repeat; border-right:#ddd solid 1px ; border-left:#ddd solid 1px ;list-style:none; margin:2px 0 25px 0;min-height:3.2em; padding-left:0; width:541px; }/*margin top hacked in ie7*/
        #Mid .Progress li{ background:url(/images/btn/buy_process/li_bg.gif) no-repeat top right; color:#777 ;float:left; font-size:1.2em;display:inline;
							font-weight:bold ;line-height:32px ; min-height:32px; padding:0px; min-width:63px; padding-right:10px; }/*143*/
        #Mid .Progress li.Current{ background-image:url(/images/btn/buy_process/li_bg_current.gif) ; }
            #Container .Progress li a {display:block; float:left ; min-height:2em; text-decoration:none }
            #Container .Progress li a:hover {color:#444 ;text-decoration:none}
            #Container .Progress li.Current a {background:url(/images/btn/buy_process/a_current.gif) no-repeat ;color:#fff ;left:-8px; padding-left:4px; position:relative; }
            #Container .Progress li.Current a:hover {color:#fff ;cursor:default}
            .Progress li.Enabled a {color:#3399CC}
                .Progress li span {background:url(/images/btn/buy_process/span_bg.gif) no-repeat top; display:inline; font-size:0.9em;float:left; height:20px; line-height:20px; margin:0 3px 0 3px ;position:relative ; top:6px;text-indent:7px; width:20px }
                .Progress li.Current span {background:url(/images/btn/buy_process/span_bg_current.gif) no-repeat !important ; }
                .Progress a:hover span {background:url(/images/btn/buy_process/span_bg.gif) no-repeat bottom; }
                .Progress li.Current a:hover span {background:url(/images/btn/buy_process/span_bg_current.gif) no-repeat ; }   
            #Container .Progress #First a {background-image:none;left:0 ;}
            #Container .Progress .Last {background-image:none; min-width: 80px; }/*width:80px;*/
            
        /*applied to be used when enabled = true but no link is required*/    
		#Mid .Progress li.Disabled div {background:url(/images/btn/buy_process/a_current.gif) no-repeat ;color:#fff ;left:-8px;min-width:120px; padding-left:8px; position:relative; }
		#Mid .Progress li.Disabled div span {color:#fff; background:url(/images/btn/buy_process/span_bg.gif) no-repeat top; display:block; font-size:0.9em;float:left; height:20px; line-height:20px; margin:0 3px 0 3px ;position:relative ; top:6px;text-indent:7px; width:20px}
    /*--fund choose list--*/
    
    #Mid .FundChoose { list-style:none ; list-style-position:inside; padding-left:0; margin-left:0;}
        #Mid .FundChoose li { margin:0 ; padding:0 0 10px 0 ;}
            .FundChoose li h2 { margin:0 0 3px 0; padding:15px 0 0 65px; border-top: solid 1px #e1e1e1; position:relative; border-bottom:none; font-size: 1.1em;}
            .FundChoose h2.first {border:none}
                .FundChoose h2 span{ color:#3399CC ;font-weight:bold ;position:absolute; }
                .FundChoose h2 span.Chev{ font-size:3em; left:0px ; top:20px;}
                .FundChoose h2 span.FakeNum{font-size:1.6em ;left:0px; width: 35px; height: 35px; overflow: hidden; padding-left: 20px; padding-top: 3px;   background: url(/img/bullets/ol-bg-lg.gif) no-repeat center top; color: #fff;}
            .FundChoose li p {font-weight:normal; color:#444; margin-left:65px;}
            .IFSL .fliplink {float:right}
            .FundChoose h4, .FundChoose table {margin-left:65px;}
            .FundChoose div.cta {margin-left:65px; margin-top: 15px; }

				 #Mid .FundChoose .unWrap {font-size:1em}
                #Mid .FundChoose .unWrap {color:#004990}
                #Mid .FundChoose .unWrap:hover {color:#2A303B}
                #Mid .checkOut {background:#2A303B ; }
               
    /*- basket selection -*/
    #Mid ul.Tight li { margin-bottom: 1px; padding-bottom: 0;}
    .buyTable table tr td { vertical-align: middle; }
    
    .refine {background: #E9E9E9; border-top: solid 3px #3399cc; overflow:auto ; overflow-x:hidden /*safari fix*/; margin:0 ; padding:10px; }
        .refine div{ float:left; margin-right:10px; }
            .refine label, .refine h3 { color:#555555 ;font-weight:bold; }
            .refine select, .refine input{ margin-top:5px; }
            .refine span.balance{ font-size: 1.2em; }
	
    /*- star ratings explained -*/
    
    span.fivestar, span.fourstar, span.threestar, span.twostar, span.onestar { background: url(../img/icons/5star_1.gif) no-repeat 0 1px; padding-left: 60px; }
		span.fourstar { background-image: url(../img/icons/4star_1.gif)}
		span.threestar { background-image: url(../img/icons/3star_1.gif)}
		span.twostar { background-image: url(../img/icons/2star_1.gif)}
		span.onestar { background-image: url(../img/icons/1star_1.gif)}
		
	.buyFundFooter { background-color: #EEEEEE; clear: both; height: 220px; position: relative; padding: 15px; }
	#ContentOver .buyFundFooter { bottom: -55px; }
	.buyFundFooter h2 { padding-top: 0em; }
	.buyFundFooter h3 { margin-bottom: 4px; }
	
	#Mid ul.paymentOptions { margin-left: 0; padding-left:0; overflow: hidden; }
	#Mid ul.paymentOptions li{ float:left; list-style-type:none; margin-right:42px; }
	#Mid ul.paymentOptions li.Last { margin-right: none; }