/*
    <h2>Contents</h2>
    <div class="TOC">
    <ol>
        <li><a href="#clientgroup">Client Group</a></li>
        <li><a href='#global'>Global</a>
        <ol>
            <li><a href='#globalcolours'>Colours</a></li>
            <li><a href='#globalimages'>Images</a></li>
            <li><a href='#globaltype'>Typography</a></li>
            <li><a href='#globalflow'>Flow</a></li>
            <li><a href='#breakpoints'>Responsive breakpoints</a></li>
        </ol>
        </li>
        <li><a href='#header'>Page header</a></li>
        <li><a href='#footer'>Page footer</a></li>
        <li><a href='#myaccounts'>My account pages</a></li>

        <li><a href='#findaddwid'>Find Address Widget</a></li>
        <li><a href='#DisplayDCInvestments'>DC Investments Styling</a></li>
        <li><a href='#DisplayDCLifeStyleMatrix'>DC Lifestyle Matrix Styling</a></li>
        <li><a href='#DCModellerChart'>DC Modeller Chart Styling</a></li>
    
        <li><a href='#kovwid'>Key Object Viewer Widget</a></li>

        <li><a href='#ftsearchwid'>Full Text Search Widget</a></li>
        <li><a hef='#cssfile'>Styling Files</a>
        <ol>
            <li><a href='#eleall'>Elements - All</a></li>
            <li><a href='#elehead'>Header Element</a></li>
            <li><a href='#elefoot'>Footer Element</a></li>
            <li><a href='#eleform'>Form Elements</a></li>
            <li><a href='#elebody'>Body Elements</a></li>
            <li><a href='#elelink'>Links</a></li>
            <li><a href='#elequotes'>Quotes</a></li>
            <li><a href='#eletab'>Tables and List</a></li>
            <li><a href='#paglay'>Page Layout</a></li>
            <li><a href='#fontawe'>Font Awesome Icons</a></li>
            <li><a href='#qtips'>Qtips</a></li>
            <li><a href='#datepick'>Datepicker</a></li>
            <li><a href='#addpick'>Address Picker</a></li>
            <li><a href='#accord'>Accordions</a></li>
            <li><a href='#alert'>Alerts</a></li>
            <li><a href='#bread'>Breadcrumbs</a></li>
            <li><a href='#civmenu'>Civica Menu</a></li>
            <li><a href='#help'>Help</a></li>
            <li><a href='#advsearch'>Advanced Search</a></li>
            <li><a href='#busy'>Busy Indicator</a></li>
            <li><a href='#kov'>Keyobject Viewer</a></li>
            <li><a href='#docv'>Document Viewer</a></li>
            <li><a href='#docl'>Document List</a></li>
            <li><a href='#lists'>List Styling</a></li>
            <li><a href='#modeller'>Modeller Styling</a></li>
        </ol>
       </li>
            <li><a href='#GBG'>GBG Standard Templates</a>
        <ol>
    <li><a href='#gbginitializing'>Initializing Template</a></li>
      <li><a href='#gbggateway'>Gateway Template</a></li>
     <li><a href='#gbgsmart'>Smart Camera Template</a></li>
     <li><a href='#gbgfile'>File System Template</a></li>
     <li><a href='#gbgcamera'>Camera Template</a></li>
     <li><a href='#gbgview'>View Template</a></li>
     <li><a href='#gbgliveness'>Liveness Template</a></li>
      <li><a href='#gbgcropper'>Cropper Template</a></li>
        </ol>
       </li>
    </ol>    
*/
/* 
    <h2 id='clientgroup'>Client Group</h2>
    <p>These are used to hide or show content elements in the onecolumn template contents</p>
    <p>To use restrict by a data attribute of data-clientgroup e.g &lt;div data-clientgroup='MyClientGoup1,MyOtherClientGroup'&gt;Some content&lt;/div&gt<p>
    <p>Put in the group they belong to and these elements will only be rendered if you hit the page as the right client ref</p>
*/
/*
   <h2 id='global'>Global</h2>
*/
/*    
    <h3 id='globalcolours'>Global colours</h3>
*/
/*
<h3 id="globalimages">Images</h3>

    <p>For the logo use an image with the same height as the header</p>
<div>
*/
/*
</div>
<script>
    $("script").last().prev("div").find(".civica-content img").css("background-color",$("header").css("background-color"));
</script>

*/
/*
<h3 id="globaltype">Typography</h3>
*/
/*  
    <h3 id='globalflow'>Global flow</h3>
*/
/* 
    <p>Control the spacing round certain elements.</p>

    <p>The civica-content class can be used to denote seperate sections of content, for example some instructions, or a button group.</p>
    <p>The content class will have the default spacing applied to the base.</p>

    <div class="civica-content" style="border: 1px dotted lightgrey">Example text in civica-content.  Below are some standard buttons</div>
    <div class="civica-content">
        <input type="button" value="example button" />
        <input type="button" value="example button 2" />
    </div>
*/
/* 
    <h2 id="header">Page Header</h2>
*/
/* 
    <h2 id="footer">Page footer</h2>
*/
/*
    <div class="civica-content">
    <h2 id="breakpoints">Responsive breakpoints</h2>
    <ul>
<li>Phones < @breakpoint-small</li>
<li>Small device tables >= breakpoint small</li>
<li>Medium device desktops >= breakpoint medium</li>
<li>Large device desktops >= breakpoint large</li>
    </ul>
    </div>
*/
/* 
    <h2 id="myaccounts">My Accounts</h2>
    <p>For best results use an image with a ratio of 4:1 (width:height)</p>
    <p>E.g. 1380px by 345px</p>
*/
/*
    <h2 id="findaddwid">Find Address Widget</h2>
    <p>Default styling for the Find Address Widget.  This widget searches for addresses based on the supplied search criteria, allows for the selection from anm address list and provides the ability to add new address.</p>
    <p><a href="#addpick">Address Finder Example</a><p> 
    <p><a href="#top">Back to top of page</a></p>
*/
/*
    <h2 id="kovwid">Key Object Viewer Widget</h2>
    <p>Default styling for the Key Object Viewer Widget.  This widget displays KeyObject (Case) Information.</p>
    <p><a href='#kov'>Key Object Viewer Example</a></p>  
    <p><a href="#top">Back to top of page</a></p>
*/
/*
    <h2 id="ftsearchwid">Full Text Widget</h2>
    <p>Default styling for the Free Text Widget.  This is how the free text field for searching can be rendered.</p>
    <div style='border: 1px solid #000000 ;padding:15px'>
      For example
    <div class="fulltextsearchwidget"><div class="civicafulltextsearch">
    <input type="text" class="searchbox" data-bind="value: SearchText, valueUpdate: 'afterkeydown', enterKey: EnterPressed, placeholder: 'widget.forms.fulltextsearch.defaulttext', msgapp: 'Core'" placeholder="E.g. Name / Address"><button type="button" class="searchbutton" data-bind="click: onSearch" value="Search" aria-label="Search"><i class="fa fa-search"></i></button>  
    </div></div>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/
/*

    <h2 id="lists">List Styling</h2>
    <p>Default styling for Lists.  In this section we specify the styling we have created for lists.</p>
    <div style='border: 1px solid #000000 ;padding:15px'>
      For example
     <p>Thumbnail List - This is a list with an image of the left and text on the right of the image.  Please note the border has been added here placeholder purposes</p>
    <ul class="civica-thumbnaillist" aria-atomic="true" aria-live="polite" aria-relevant="all"><li class="civica-thumbnailitem"><div class="civica-thumbnailrow"><canvas width="125" height="125" style="border: 1px solid;"></canvas><div class="civica-thumbnailtext"><button>Remove</button></div></div></li></ul>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/
/* 
    <h2 id="modeller">Modeller</h2>
*/
/*
    <div class="modellerChart">
                <div class="upmRetirementModelChartSection">
                    <div class="chart" data-bind="civicaBarChart: retirementModellerChartDatasuggestedGovIncome">
                        <div class="maxbar" style="height:75%">

                        </div>
                        <div class="valbar" id="TargetIncomeBar" style="height:25%">

                        </div>
                        <div class="upmChartLabel">Target Income</div>
                        <div class="upmChartLabel">£10,000</div>
                    </div>

                    <div class="chart" data-bind="civicaBarChart: retirementModellerChartDataAnnualIncome">
                        <div class="maxbar" style="height:80%">

                        </div>
                        <div class="valbar" id="AnnualIncomeBar" style="height:20%">

                        </div>
                        <div class="upmChartLabel">Annual Income</div>
                        <div class="upmChartLabel">£8,000</div>

                    </div>

                    <div class="chart" data-bind="civicaBarChart: retirementModellerChartDataLumpSum">
                        <div class="maxbar" style="height:50%">

                        </div>
                        <div class="valbar" id="LumpSumBar" style="height:50%">

                        </div>
                        <div class="upmChartLabel">Lump Sum</div>
                        <div class="upmChartLabel">£20,000</div>
                    </div>
                    <br>
                </div>
                <br>
                <br>
            </div>
    <br>
*/
/* 
    <p><a href="#top">Back to top of page</a></p>
/*
/*
<h2 id='DisplayDCInvestments'>Display DC Investments</h2>
    <p>Default styling for the Display DC Investment process action.  This is how the Display DC Investment process action can be rendered.</p>
  
<div style='border: 1px solid #000000;padding:15px' >
For example
<div class="civicaprocactiondetail" >



<div class="TotalsByFundTypeData" >
<h4 > Fund Type</h4 >
<canvas id="TotalsByFundChart" role="img" width="400" height="400" aria-label="Pie Chart of Fund Types in percentages. Cash: 30.00%, Guilts: 20.00%, Balanced: 20.00%, Equities: 20.00%, Unknown: 10.00%" > </canvas >

</div >
<div class="InvestmentReturn" >
<h4 > Investment Return</h4 >
<canvas id="InvestmentReturnChart" width="400" height="400" role="img" aria-label="Line Chart of Total Fund Value over time. 1 January 2020: £1000.00, 8 January 2020: £1100.00" class="chartjs-render-monitor" > </canvas >
</div >
</div >
</div >
<p><a href="#top">Back to top of page</a></p>
<p>Note: Fund types are sorted by amount and the colouring of the segments are from Largest percentage to smallest. Where fund type pie chart color 1 is given to the largest segment, color 2 is given to the next segment and on etc.</p>
<script >

function get_style_rule_value(selector, style) {
    for (var i = 0; i < document.styleSheets.length; i ++ ) {
        var mysheet = document.styleSheets[i];
      var myrules = mysheet.cssRules ? mysheet.cssRules : mysheet.rules;

      for (var j = 0; j < myrules.length; j++)

{
    if (myrules[j].selectorText && myrules[j].selectorText.toLowerCase() === selector) {
        return myrules[j].style[style];
    }
}

}
}
;


new Chart(document.getElementById("TotalsByFundChart"), {
                    type: 'pie',
                    data: {
                        labels:  ['Largest Segment (30%)','2nd Segment (20%)','3rd Segment (20%)','4th Segment (20%)','5th Segment (10%)'],
                        datasets: [{
                            label: "Percentage of total",
                            backgroundColor: [get_style_rule_value('.fund-type-pie1','background-color'), get_style_rule_value('.fund-type-pie2','background-color'), get_style_rule_value('.fund-type-pie3','background-color'), get_style_rule_value('.fund-type-pie4','background-color'), get_style_rule_value('.fund-type-pie5','background-color')],
                            data:  ['30','20','20','20','10']                            
                        }]
                    },
                    options: {
      
legend: {
    position: 'bottom',
    onClick: null,
},
tooltips: {
    enabled: false
},
hover: {
    mode: null
}

}
} );


new Chart(document.getElementById("InvestmentReturnChart"), {
                    type: 'line',
                    data: {
                        labels: ['01/01/2020','08/01/2020'],
                        datasets: [{
                            data: [1000,1100],
                            label: "Total Fund Value",
                            borderColor: get_style_rule_value('.investment-return-line1','background-color'),
                            fill: false
                            
                        },
                        ]
                    },
                    options: {
          
                            title: {
                            display: false,
        
                            fontSize: 16
                        },
                        legend: {
                            position: 'bottom',
                            onClick: null,
                            display:false
                        },
                        scales: {
                            yAxes: [{
                                display: true,
                                scaleLabel: {
                                    display: true,
                                    labelString: '£ Total Fund Value'
                                },
                                ticks: {
                                    userCallback: function (value, index, values) {
                                        value = value.toString();
                                        value = value.split(/(?=(?:...)*$)/);
                                        value = value.join(',');
                                        return value;
                                    }
                                }


                            }]
                        },
                        tooltips: {
                            enabled: false
                        },
                        hover: {
                            mode: null
                        }

                    }
                });

</script >
*/
/* 
    <p><a href="#top">Back to top of page</a></p>
*/
/*
    <h2 id='DisplayDCLifeStyleMatrix'>Display DC LifeStyle Matrix</h2>
    <div id="matrixcontainer">
<canvas id="matrixChart" width="100%" height="400px"></canvas>
</div>

    <script>
    
    new Chart(document.getElementById("matrixChart"), {
    type: 'bar',
    data: {
      labels: [55,56,57,58,59,60], 
      datasets: [{
        label: 'Equities', 
        data: [25,25,25,25,25,25], 
					'backgroundColor': get_style_rule_value('.dc-matrix-equities', 'background-color'),

      }, {
					'label': 'Balanced',
				   data: [25,25,25,25,25,25], 
	'backgroundColor': get_style_rule_value('.dc-matrix-balanced', 'background-color'),
				
				}, {
					'label': 'Gilts',
					   data: [25,25,25,25,25,25], 
				'backgroundColor': get_style_rule_value('.dc-matrix-gilts', 'background-color'),
				
				}, {
					'label': 'Cash',
					   data: [25,25,25,25,25,25], 
				'backgroundColor': get_style_rule_value('.dc-matrix-cash', 'background-color'),
					
				}]
    },
    options: {
      responsive: true, 
      maintainAspectRatio: false,
	  'scales': {
				'xAxes': [{
				'ticks': {
	callback: function(value, index, values) {
	if (index ==0)
	{	
		value = ['Current','Profile'];
	}
	 return  value;
	}
    },
						'stacked': true,
						'scaleLabel': {
							'display': true,
							'labelString': 'AGE'
						}
					}
				],
				'yAxes': [{
						'stacked': true,
						'ticks': {
							'beginAtZero': true,
							stepSize:10,
            
                    callback: function(value, index, values) {
                        return  value + '%';
                    }
						},
						'scaleLabel': {
							'display': true,
							'labelString': 'ALLOCATION'
						}
					}
				]
			},
	'legend': {
				'display': true,
				position: 'right'
	},
		title: {
	display: false
    }
    }
  });
   
 

    </script>
*/
/* 
    <p><a href="#top">Back to top of page</a></p>
*/
/*
    <h2 id='DisplayDCModeller'>Dc Modeller Chart</h2>
    <div id="DCModellercontainer">
<canvas id="DCModellerChart" width="99%" height="400px"></canvas>
</div>

    <script>
       new Chart(document.getElementById("DCModellerChart"),  {
 	"type": "bar",
 	"data": {
 		"labels": ["Target", ["Annual Pension", "at Selected", "Retirement Date"], ["Cash Lump Sum", "at Selected", "Retirement Date"]],
 		"datasets": [{
 				"label": "Target",
 				"data": [15399, null, null],
 					'backgroundColor': get_style_rule_value('.dc-modeller-target', 'background-color')
 			}, {
 				"label": "State Pension",
 				"data": [null, 5000, null],
 			'backgroundColor': get_style_rule_value('.dc-modeller-state', 'background-color')
 			}, {
 				"label": "Lumpsum",
 				"data": [null, null, 5000],
 				'backgroundColor': get_style_rule_value('.dc-modeller-cash', 'background-color')
 			}, {
 				"label": "Annual pension after lump sum taken",
 				"data": [null, 1000, null],
 		'backgroundColor': get_style_rule_value('.dc-modeller-pension', 'background-color')
 			}
 		]
 	},
 	"options": {
    responsive:true,
      maintainAspectRatio: false,
 		"scales": {
 			"xAxes": [{
 					"stacked": true
 				}
 			],
 			"yAxes": [{
 					"stacked": true,
 					"ticks": {
 						"beginAtZero": true
 					}
 				}
 			]
 		},
 		"legend": {
 			"display": false
 		}
 	}
 }
 
 );
   
 

    </script>
*/
/* 
    <p><a href="#top">Back to top of page</a></p>
*/
/*
    <h2 id="GBG">GBG Standard Templates - will not reflect any local changes</h2>
      <p>CSS File:<strong>component.journeycontainer.less</strong></p>
*/
/*
    <h3 id="gbginitializing" >Initializing Template</h3 >
    <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
    <div id="GBG-root">
    <h2 class="section-title" ><i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i> Initializing</h2 >
    <p>Checking hardware capabilities, please wait...</p >
    </div>
    </div>
*/
/*

    <h3 id="gbggateway">Gateway Template</h3>
    <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
      <div id="GBG-root">
        <h2 class="section-title">Identity Verification</h2>     
        <hr>
        <div data-jcs-element="provider__container" class="provider-container"></div>
       <!-- <form data-jcs-element="gateway__upload" class="upload-toggle--container" style="display:none">
            <label data-jcs-element="gateway__upload__toggle__label" class="upload-toggle--label">
                <input data-jcs-element="gateway__upload__toggle" class="upload-toggle" type="checkbox" /> <span class="upload-toggle--text">Camera Enabled</span>
            </label>
            <p data-jcs-element="gateway__camera__status"></p>
        </form>-->
        <form class="button-container">	<input data-jcs-element="cancel__journey" class="button button-secondary fa fa-input" type="button"  value="&#xf00d; I want to exit and carry on later"/></form>
    </div>
    </div>

*/
/*

     <h3 id="gbgsmart">Gateway Template - with smart provider</h3>
      <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
      <div id="gbg-root">
         <h2 class="section-title">Identity Verification</h2>
        <hr>
       
      <div class ="CaptureIDFront" style="display:block">
         
        <h2 class="section-title">Provide Photo ID</h2>
        <p class="section-title">We'll need you to take a photo of the front of your ID</p>
        </div>
           <div class ="CaptureSelfie" style="display:none"> 
           <h2 class="section-title">{{PROVIDER_TITLE_SMART_CAPTURE_SELFIE}}</h2>
        <p class="section-title">{{PROVIDER_SUBTITLE_SMART_CAPTURE_SELFIE}}</p>
        </div>
           <div class ="CaptureAddress" style="display:none">
            <h2 class="section-title">{{PROVIDER_TITLE_SMART_CAPTURE_ADDRESS}}</h2>
        <p class="section-title">{{PROVIDER_SUBTITLE_SMART_CAPTURE_ADDRESS}}</p>
           </div>
      <div class ="NextAttempt" style="display:block">
             <div data-bind="standarderror: Message"><div><div class="civicainfoblock  ui-state-error ui-corner-all"><span role="alert">Sorry that image has not been accepted</span></div></div></div>
            <p>Please supply another Picture (attempt <span data-jcs-element="info__journey__action__attempt" class="info-item__value">2</span>/3)</p>
            </div>
               		
              
    <div class="ensure">
    <h2><i class="fa fa-info-circle"></i> You will need to make sure</h2>	
                <ul>
                <li><span>The photo is clear and in focus</span></li>
                <li><span>There is no glare on the photo</span></li>
                <li><span>You're using the original document</span></li>
                </ul>
                </div>
                <p data-jcs-element="camera__status" class="camera-status"></p>
                <form class="camera-options--container">
                    <label for="Cameras">Camera select:</label>
                    <select name="Cameras" id="Cameras" data-jcs-element="camera__select" class="camera-choices">
                        <option value="front">Front Camera</option>
                        <option value="back">Back Camera</option>
                    </select>
                </form>
                <div class="camera-viewfinder--container" style="background:black">
                    <canvas data-jcs-element="camera__viewfinder" class="camera-viewfinder"></canvas>
                </div>
            <div class="camera-conditions--container">
            <span data-jcs-element="camera__condition__uploading" class="camera-condition camera-condition--uploading" ><i class="fa fa-info-circle"></i> Uploading</span> <span data-jcs-element="camera__condition__capturing" class="camera-condition camera-condition--capturing" style=""><i class="fa fa-info-circle"></i> Capturing</span> <span data-jcs-element="camera__condition__alignment" class="camera-condition camera-condition--alignment" style=""><i class="fa fa-exclamation-triangle"></i> Alignment</span> <span data-jcs-element="camera__condition__blur" class="camera-condition camera-condition--blur" style=""><i class="fa fa-exclamation-triangle"></i> Blur</span> <span data-jcs-element="camera__condition__glare" class="camera-condition camera-condition--glare" ><i class="fa fa-exclamation-triangle"></i> Glare</span> <span data-jcs-element="camera__condition__low__resolution" class="camera-condition camera-condition--low-resolution" style=""><i class="fa fa-exclamation-triangle"></i> Low Resolution</span> 
        </div>
          <form class="button-container">
            <input data-jcs-element="camera__capture" class="button button--primary fa fa-input" type="button" value="&#xf00c; I am ready to take photos" />
    
        </form>
         <form class="button-container">
            <input data-jcs-element="camera__capture" class="button button-secondary fa fa-input" type="button" value="&#xf07c; Upload an existing photo of ID" />
    
        </form>
      <form class="button-container">
            <input data-jcs-element="camera__capture" class="button-secondary fa fa-input" type="button" value="&#xf00d; I want to exit and carry on later" />
        </form>
    </div>
    </div>
*/
/*
     <h3 id="gbgfile">Gateway Template - with File System</h3>
      <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
      <div id="gbg-root">
        <h2 class="section-title">Identity Verification</h2>
        <hr>      
        <div data-jcs-element="provider__container" class="provider-container">
        <h2 class="section-title">Upload a picture from your device</h2>
        <p class ="CaptureIDFront" style="display:block">Please submit the Front of your ID</p>
      <div class="ensure">
    <h2 class="card-title"><i class="fa fa-info-circle"></i> You will need to make sure</h2>	
                <ul>
                <li><span>The photo is clear and in focus</span></li>
                <li><span>There is no glare on the photo</span></li>
                <li><span>You're using the original document</span></li>
                </ul>
                </div>
        <form class="file-input--container">
        <input data-jcs-element="file__input" class="file-input" id="jcs__file__input" type="file" />
        </form>
        <label data-jcs-element="file__drop__box" class="file-input--alternatives" for="jcs__file__input">
            <span class="file-input--click">Select</span>
            <span data-jcs-element="file__drop__label" class="file-input--drag">or Drop Image</span>
        </label>
     </div>
            <form class="button-container">
            <input data-jcs-element="camera__capture" class="button button-secondary fa fa-input" type="button" value="&#xf03d; Use my camera to take a photo of ID" />
    
        </form>
      <form class="button-container">
            <input data-jcs-element="camera__capture" class="button-secondary fa fa-input" type="button" value="&#xf00d; I want to exit and carry on later" />
        </form>
        </div>
    </div>
   
*/
/*

     <h3 id="gbgcamera">Gateway Template - with Camera</h3>
  <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
    <div id="gbg-root">
        <h2 class="section-title">Identity Verification</h2>
        <hr>
        <div data-jcs-element="provider__container" class="provider-container">
   <div class ="CaptureIDFront" style="display:none">
         
        <h2 class="section-title">{{PROVIDER_TITLE_CAMERA_IDFRONT}}</h2>
        <p class="section-title">{{PROVIDER_SUBTITLE_CAMERA_IDFRONT}}</p>
        </div>
           <div class ="CaptureSelfie" style="display:block"> 
           <h2 class="section-title">Provide a photo of you now</h2>
        <p class="section-title">We'll need you to take a photo of yourself to compare to your ID</p>
</div>
           <div class ="CaptureAddress" style="display:none">
            <h2 class="section-title">{{PROVIDER_TITLE_SMART_CAPTURE_ADDRESS}}</h2>
        <p class="section-title">{{PROVIDER_SUBTITLE_SMART_CAPTURE_ADDRESS}}</p>
           </div>
      <div class="ensure">
    <h2><i class="fa fa-info-circle"></i> You will need to make sure</h2>	
                <ul>
                <li><span>The photo is clear and in focus</span></li>
                <li><span>There is no glare on the photo</span></li>
                <li><span>You're using the original document</span></li>
                </ul>
                </div>
                <p data-jcs-element="camera__status" class="camera-status"></p>
                <form class="camera-options--container">             
                         <label for="Cameras2">Camera select:</label>
                        <select name="Cameras2" id="Cameras2" data-jcs-element="camera__select" class="camera-choices">
                        <option value="front">Front Camera</option>
                        <option value="back">Back Camera</option>
                    </select>
            </form>
            <div class="camera-viewfinder--container" style="background:black">
                <canvas data-jcs-element="camera__viewfinder" class="camera-viewfinder"></canvas>
            </div>
            <form class="button-container">
                <input data-jcs-element="camera__capture" class="button button--primary fa fa-input" type="button" value="&#xf00c; Take Photo" />
            </form>
            </div>
    </div>
     <form class="button-container">
            <input data-jcs-element="camera__capture" class="button button-secondary fa fa-input" type="button" value="&#xf07c; Upload an existing photo of ID" />
    
        </form>
      <form class="button-container">
            <input data-jcs-element="camera__capture" class="button-secondary fa fa-input" type="button" value="&#xf00d; I want to exit and carry on later" />
        </form>
        </div>
    </div>
*/
/*
         <h3 id="gbgview">View Template</h3>


       <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
      <div id="gbg-root">
       <h2 class="section-title">Identity Verification</h2>     
        <hr>
    <h2 class="section-title">Double check your photo</h2>
        <p>If these photos are not clear we might have to ask you to retake them, so please ensure they meet our requirements</p>
        
            
     <div class="camera-viewfinder--container" data-fullscreen="false" style="background:black">
            <canvas data-jcs-element="camera__viewfinder" class="camera-viewfinder"></canvas>
        
        </div>
        <div class="ensure">
            <h2><i class="fa fa-info-circle"></i> Please Ensure that</h2>	
            <ul>
            <li><span>The Photo is clear</span></li>
            <li><span>You can read all the text clearly</span></li>
            <li><span>There's no glare</span></li>
            </ul>
        </div>
      <form class="button-container">   
            <input data-jcs-element="view__upload" class="button button--primary fa fa-input" type="button" value="&#xf00c; Submit photo" />
        </form>
         <form class="button-container">
    <input data-jcs-element="view__retry" class="button button-secondary fa fa-input" type="button" value="&#xf0e2; Re-take Photo" />
      </form>
        <form class="button-container">
            <input data-jcs-element="view__begin__crop" class="button button-secondary fa fa-input" type="button" value="&#xf125; I need to crop my photo" />
        </form>
          <form class="button-container">
            <input data-jcs-element="camera__capture" class="button-secondary fa fa-input" type="button" value="&#xf00d; I want to exit and carry on later" />
        </form>
      
        <div data-jcs-element="view__status">
            <p data-jcs-element="view__status__message"></p>
        </div>
       </div>

       </div>
*/
/*
      <h3 id="gbgliveness">Liveness Template</h3>
      <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
      <div id="gbg-root">
    <h2 class="section-title">Identity Verification</h2>
        <hr>
        <h2 class="section-title">Match the ID document to your face</h2>
        <p>We'll need you to perform a few gestures to make sure you match your ID document.</p>
            <div class="ensure">
            <h2><i class="fa fa-info-circle"></i>To complete this check you'll need to:</h2>	
            <ul>
            <li><span>Keep your face in view of the camera</span></li>
            <li><span>Perform the prompts that appear on the screen</span></li>
            </ul>
        </div>
        <p data-jcs-element="camera__status" class="camera-status"></p>
        <form class="camera-options--container">
            <label for="Cameras3">Camera select:</label>
            <select name="Cameras3" id="Cameras3" data-jcs-element="camera__select" class="camera-choices">
            <option value="front">Front Camera</option>
            <option value="back">Back Camera</option></select>
        </form>
        <div data-jcs-element="retina__notifications" class="camera-message--container">
            <span data-jcs-element="retina__message" class="camera-message">Look Straight Ahead</span>
            <span data-jcs-element="retina__timer" class=camera-countdown""></span>
        </div>
        <div class="camera-viewfinder--container" data-fullscreen="false" style="background:black">
            <canvas data-jcs-element="camera__viewfinder" class="camera-viewfinder"></canvas>
        </div>
        <form class="button-container">
                 <input data-jcs-element="retina__start" class="button button--primary fa fa-input" type="button" value="&#xf00c; Start Liveness" />
        </form>
    <form class="button-container">	<input data-jcs-element="cancel__journey" class="button button-secondary fa fa-input" type="button" value="&#xf00d; I want to exit and carry on later" /></form>
   
        </div>
    </div>

          <h3 id="gbgcropper">Cropper Template</h3>
      <div class="civicaprocwidgetnoui ui-widget ui-widget-content">
    <div id="gbg-root">
        <h2 class="section-title">Identity Verification</h2>
        <hr>
        <div data-jcs-element="provider__container" class="provider-container">
        <h2 class="section-title">Crop your image to help us identify it</h2>
        <p class="section-title">Move the four points so that they line up with the corners of your ID</p>
        <div class="cropper--container">
            <canvas data-jcs-element="cropper__canvas" class="cropper" id="jcs__cropper__canvas" style="background:black"></canvas>
        </div>
        <form class="button-container">
            <input data-jcs-element="cropper__submit" class="button button--primary fa fa-input" type="button" value="&#xf00c; Submit my cropped image for verification">
        </form>
        <form class="button-container">    
            <input data-jcs-element="cropper__retry" class="button button-secondary fa fa-input" type="button" value="&#xf0e2; Pick another image or take another photo">
        </form>
        <div data-jcs-element="cropper__status">
            <p data-jcs-element="cropper__status__message"></p>
        </div>
    </div>
        <form data-jcs-element="gateway__upload" class="upload-toggle--container" style="display:none">
            <label data-jcs-element="gateway__upload__toggle__label" class="upload-toggle--label" style="display: none;">
                <input data-jcs-element="gateway__upload__toggle" class="upload-toggle" id="upload-toggleid" type="checkbox" style="display: none;"><span class="upload-toggle--text">Use my Camera</span>
            </label>
            <p data-jcs-element="gateway__camera__status"></p>
        </form>
        <form class="button-container">	<input data-jcs-element="cancel__journey" class="button button-secondary fa fa-input" type="button" value="&#xf00d; I want to exit and carry on later"></form>
    </div>
    </div>
*/
/* END */
/* This file needs the END bit at the end*/
/* 
 This project follows Inverted Triangle CSS (ITCSS) by 
 Harry "CSS Wizardry" Roberts. Files should be organized 
 by groups. As you go 
 down the list of files you should go from: 
  
   Generic to explicit 
   Far-reaching to localised 
   Low specificity to high specificity 
  
 */

/* 
    @import 'variables.less';

    The lessvariable service (in CivicaTown) will put a styles.less in the client directory which will bring in the right variables.less
    depending on if a clientRef has been set on the url

*/

/* 
 Settings store all variables, config switches, etc. 
 Split up into logical sections, the smaller and simpler the better. 
 */

/*
    //<h2>Settings - Fonts</h2>
    //<p style ='color:red'>Need more information on what this is for</p> 
    //<p><a href="#top">Back to top of page</a></p>

*/

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url("../../fonts/Regular/OpenSans-Regular.eot?v=1.1.0");
  src: url("../../fonts/Regular/OpenSans-Regular.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../../fonts/Regular/OpenSans-Regular.woff2?v=1.1.0") format("woff2"), url("../../fonts/Regular/OpenSans-Regular.woff?v=1.1.0") format("woff"), url("../../fonts/Regular/OpenSans-Regular.ttf?v=1.1.0") format("truetype"), url("../../fonts/Regular/OpenSans-Regular.svg?v=1.1.0#Regular") format("svg");
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url("../../fonts/Semibold/OpenSans-Semibold.eot?v=1.1.0");
  src: url("../../fonts/Semibold/OpenSans-Semibold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../../fonts/Semibold/OpenSans-Semibold.woff2?v=1.1.0") format("woff2"), url("../../fonts/Semibold/OpenSans-Semibold.woff?v=1.1.0") format("woff"), url("../../fonts/Semibold/OpenSans-Semibold.ttf?v=1.1.0") format("truetype"), url("../../fonts/Semibold/OpenSans-Semibold.svg?v=1.1.0#Semibold") format("svg");
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: url("../../fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.eot?v=1.1.0");
  src: url("../../fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../../fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.woff2?v=1.1.0") format("woff2"), url("../../fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.woff?v=1.1.0") format("woff"), url("../../fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.ttf?v=1.1.0") format("truetype"), url("../../fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.svg?v=1.1.0#SemiBoldItalic") format("svg");
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url("../../fonts/Bold/OpenSans-Bold.eot?v=1.1.0");
  src: url("../../fonts/Bold/OpenSans-Bold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../../fonts/Bold/OpenSans-Bold.woff2?v=1.1.0") format("woff2"), url("../../fonts/Bold/OpenSans-Bold.woff?v=1.1.0") format("woff"), url("../../fonts/Bold/OpenSans-Bold.ttf?v=1.1.0") format("truetype"), url("../../fonts/Bold/OpenSans-Bold.svg?v=1.1.0#Bold") format("svg");
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: url("../../fonts/BoldItalic/OpenSans-BoldItalic.eot?v=1.1.0");
  src: url("../../fonts/BoldItalic/OpenSans-BoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../../fonts/BoldItalic/OpenSans-BoldItalic.woff2?v=1.1.0") format("woff2"), url("../../fonts/BoldItalic/OpenSans-BoldItalic.woff?v=1.1.0") format("woff"), url("../../fonts/BoldItalic/OpenSans-BoldItalic.ttf?v=1.1.0") format("truetype"), url("../../fonts/BoldItalic/OpenSans-BoldItalic.svg?v=1.1.0#BoldItalic") format("svg");
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url("../../fonts/Italic/OpenSans-Italic.eot?v=1.1.0");
  src: url("../../fonts/Italic/OpenSans-Italic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../../fonts/Italic/OpenSans-Italic.woff2?v=1.1.0") format("woff2"), url("../../fonts/Italic/OpenSans-Italic.woff?v=1.1.0") format("woff"), url("../../fonts/Italic/OpenSans-Italic.ttf?v=1.1.0") format("truetype"), url("../../fonts/Italic/OpenSans-Italic.svg?v=1.1.0#Italic") format("svg");
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local('Ubuntu'), url("../../fonts/Ubuntu-Regular.eot") format("embedded-opentype"), url("../../fonts/Ubuntu-Regular.woff2") format("woff2"), url("../../fonts/Ubuntu-Regular.woff") format("woff"), url("../../fonts/Ubuntu-Regular.ttf") format("truetype"), url("../../fonts/Ubuntu-Regular.svg") format("svg");
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  src: local('Ubuntu Medium'), url("../../fonts/Ubuntu-Medium.eot") format("embedded-opentype"), url("../../fonts/Ubuntu-Medium.woff2") format("woff2"), url("../../fonts/Ubuntu-Medium.woff") format("woff"), url("../../fonts/Ubuntu-Medium.ttf") format("truetype"), url("../../fonts/Ubuntu-Medium.svg") format("svg");
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  src: local('Ubuntu Bold'), url("../../fonts/Ubuntu-Bold.eot") format("embedded-opentype"), url("../../fonts/Ubuntu-Bold.woff2") format("woff2"), url("../../fonts/Ubuntu-Bold.woff") format("woff"), url("../../fonts/Ubuntu-Bold.ttf") format("truetype"), url("../../fonts/Ubuntu-Bold.svg") format("svg");
}
/*
    Tools stores all the mixins
*/

/*
Generic rules are resets
*/

/* 
 Elements are rules for classless HTML tags. 
 There should be no classes at this layer, only further into down triangle. 
 */

/*
    <h2 id='eleall'>General Elements</h2>
    <p>CSS File:<strong>element.all.less</strong></p>
    <p>General element placeholder</p>  
*/

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
/*
    <h2 id='elebody'>Body Elements</h2>
    <p>CSS File:<strong>element.body.less</strong></p>
    <p>This file contains the element styles for html and body. Here the font family, colour,font size and margins styles are specified.</p>
    <p><a href="#top">Back to top of page</a></p>
*/

html,
body {
  height: 100%;
  margin: 0;
}
body {
  font-family: "Open Sans", sans-serif;
  background: #ffffff;
  color: #3a3a3a;
  font-size: 18px;
}
/* Wrapper for page content to push down footer */

body > div:first-of-type {
  min-height: 100%;
  height: auto;
  /* Negative indent footer by its height */
  margin: 0 auto -75px;
  /* Pad bottom by footer height */
  padding: 0 0 75px;
}
/*
    <h2 id='elehead'>Header Element</h2>
    <p>CSS File: <strong>element.header.less</strong></p>
    <p>This file contains the styling for the header element.</p> 
    <div style='border: 1px solid #000000;padding:15px'>
     For example
    <p></p>
    <header>
            
            <a href="/">
                <img src="/media/logo.png" alt="Home Page">
            </a>
            
            <a class="hidden-medium-upwards" onclick="if ($(this).next('nav').hasClass('hidden-small-only')) { $(this).next('nav').hide().toggleClass('hidden-small-only').slideDown(); } else { $(this).next('nav').slideUp(function () { $(this).show().toggleClass('hidden-small-only'); }) }; $('i', this).toggleClass('fa-flip-vertical');">Menu<i class="fa fa-caret-down"></i></a>
            <nav class="hidden-small-only">
                                    <a href="/planning/">Planning</a>
                <a href="/taxi-licensing/">Taxi Licensing</a>
                <a href="/my-property/">My Property</a>
                <a href="/my-accounts/">My Accounts</a>
                <a href="/my-requests/">My Requests</a>

            </nav>
            <div class="civica-authentication"></div>
        </header>
    </div>
    <p><a href="#top">Back to top of page</a></p>

*/

header {
  background-color: #000000;
  width: 100%;
  position: relative;
  padding: 8px 0 8px 30px;
  display: flex;
  justify-content: space-between;
}
header > nav,
header a {
  display: inline;
  margin-bottom: 0;
}
header a,
header a:visited {
  color: #FFFFFF;
}
header a:visited {
  text-decoration: none;
}
h3,
.civicasubheader {
  padding: 15px 0 5px 5px;
}
header > a {
  display: inline;
  margin-right: 15px;
}
header > nav {
  display: inline;
  display: flex;
  flex-grow: 1;
  margin-left: 5%;
  margin-right: 15px;
  align-items: center;
  flex-wrap: wrap;
}
header > nav a {
  font-size: 16px;
  white-space: nowrap;
  margin-right: 15px;
  flex-grow: 1;
  max-width: 120px;
  text-align: center;
}
header a:hover {
  color: #c2c2c2;
  text-decoration: none;
}
header > nav a.selected {
  color: #D04379;
  text-decoration: underline;
}
header > nav a.selected {
  font-weight: 700;
}
header > div.civica-authentication {
  display: inline;
  margin-top: 12px;
  margin-right: 15px;
  color: #ffffff;
  display: flex;
}
header > div.civica-authentication div {
  display: block;
}
header > div.civica-authentication .btn {
  margin-top: 0;
}
header > div.civica-authentication .civica-UnreadThreadCount {
  float: left;
}
header > div.civica-authentication .civica-UnreadThreadCounttext a[role="button"] {
  margin-top: 6px;
}
header > div.civica-authentication .civica-hello {
  padding: 12px 10px 7px 20px;
  background-color: #05242E;
  border-radius: 3px;
  cursor: pointer;
  float: right;
}
header > div.civica-authentication .civica-hellotext {
  max-width: unset;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
header > div.civica-authentication .f0d7::after {
  font-family: FontAwesome;
  content: "\f0d7";
  padding-left: 15px;
}
header > div.civica-authentication .civica-logout {
  position: absolute;
  right: 0px;
  z-index: 2;
  display: none;
  background-color: #000000;
  top: 66px;
}
header > div.civica-authentication .civica-login i {
  display: none;
}
header > div.civica-authentication .civica-login a span {
  padding-left: 0px;
}
header > div.civica-authentication .civica-logout a[role="button"] {
  padding: 8px 15px;
  margin: 0;
  white-space: nowrap;
  background-color: #000000;
  width: 100%;
  border-bottom: 1px inset #c2c2c2;
}
header > div.divLastloggedInDate {
  height: 17px;
  font-size: 12px;
  position: absolute;
  bottom: 0px;
  color: white;
  right: 15px;
}
header > div.civica-authentication .civica-logout a.user-detail-menulink {
  padding: 8px 15px;
  margin: 0;
  white-space: nowrap;
  background-color: #000000;
  width: 100%;
  border-bottom: 1px inset #c2c2c2;
  box-sizing: border-box;
  line-height: 40px;
  min-height: 40px;
  display: inline-block;
  border: none;
  cursor: pointer;
  text-align: center;
  min-width: auto;
}
@media (max-width: 767px) {
  header {
    padding: 8px 8px;
    flex-wrap: wrap;
  }
  header > a:nth-of-type(2) {
    flex-basis: 100%;
    order: 3;
  }
  header > nav {
    margin-left: 0;
    margin-right: 0;
    flex-grow: 1;
    order: 4;
    display: block;
  }
  header > nav a {
    margin-top: 15px;
    display: block;
    text-align: inherit;
  }
  header > div.civica-authentication {
    order: 2;
    margin-right: 0;
  }
}
@media only screen and (max-device-width: 480px) {
  /* styles for mobile browsers smaller than 480px; (iPhone) */
  
  header > div.civica-authentication .civica-logout {
    top: 134px;
  }
}
@media only screen and (device-width: 768px) {
  /* default iPad screens */
  
  header > div.civica-authentication .civica-logout {
    top: 121px;
  }
}
@media only screen and (min-width: 960px) {
  /* styles for browsers larger than 960px; */
  
  header > div.civica-authentication .civica-logout {
    top: 112px;
  }
}
@media only screen and (min-width: 1440px) {
  /* styles for browsers larger than 1440px; */
  
  header > div.civica-authentication .civica-logout {
    top: 66px;
  }
}
@media only screen and (min-width: 2000px) {
  /* for sumo sized (mac) screens */
  
  header > div.civica-authentication .civica-logout {
    top: 66px;
  }
}
/*
    <h2 id='elefoot'>Element - Footer</h2>
    <p>CSS File:<strong>element.footer.less</strong></p>
    <p>This file contains the styles used for the footer element</p>
    <div style='border: 1px solid #000000;padding:15px'>
      For Example
     <footer>
            <ul>
                <li>©Civica 2015</li>
            </ul>
            <ul>
                <li><a href="">Contact us</a></li>
                <li><a href="">Accessibility</a></li>
                <li><a href="">Terms</a></li>
                <li><a href="">Privacy and Cookies</a></li>
                <li><a href="/styles">Styles</a></li>

            </ul>
    </footer>
    </div>
    <p><a href="#top">Back to top of page</a></p>

*/

footer {
  color: #ffffff;
  background-color: #072438;
  padding: 15px 0;
  margin-top: 15px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
footer a {
  text-decoration: none;
}
footer a,
footer a:visited,
footer a:hover {
  color: #ffffff;
}
footer li {
  margin-right: 15px;
  white-space: nowrap;
}
footer ul {
  margin-left: 8px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
footer ul,
footer li {
  display: inline-block;
}
@media (min-width: 768px) {
  footer ul {
    margin-left: 30px;
  }
}
/*
    <h2 id='eleform'>Form Elements</h2>
    <p>CSS File:<strong>element.form.less</strong></p>
    <p>This file contains the styles for form elements - e.g input, textarea, select, button. These should only be overridden if there is a great need for it. </p>  
    <div style='border: 1px solid #000000;padding:15px'>
     For Example
    <h3>Select Box</h3>
    <div class="civicaformfield civicainputfield" data-fieldname="title"><div class="civicaQuestion"><label for="view81" id="CivicaFormLabel-1">Title *</label></div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><select id="view81" data-bind="value: Value,  options: PickListItems, optionsText: 'Desc', optionsValue: 'Code', optionsCaption: ' ', attr: { disabled: IsDisabled, 'aria-labelledby': 'CivicaFormLabel-'  + GlobalID()  }, style: { width: Width}" aria-labelledby="CivicaFormLabel-1"><option value=""> </option><option value="MR">Mr</option><option value="MRS">Mrs</option><option value="MISS">Miss</option><option value="MS">Ms</option><option value="DR">Doctor</option><option value="SIR">Sir</option></select></div></div>
    <h3>Multi-Select Box</h3>
    <p>Displays four rows</p>
    <div data-bind="controller: $data.getDefaultViewModel(), css: inputClass" class="civica-input civicakeyobjectsearch-appplancase-decisionlevelcode"><div><div class="civicaQuestion"><label for="view757" id="CivicaFormLabel-16">Decision level</label></div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><select multiple="multiple" id="view757" data-bind="options:PickListItems, optionsText: 'Desc', selectedOptions: SelectedItems, attr: { disabled: IsDisabled, 'aria-labelledby': 'CivicaFormLabel-'  + GlobalID()  }, style: { width: Width}" aria-labelledby="CivicaFormLabel-16"><option value="">Area Committee</option><option value="">Committee</option><option value="">DC Sub Committee</option><option value="">Delegated</option><option value="">Full Committee</option><option value="">Senior Officer</option></select></div></div></div>
    <h3>Input Field</h3>
    <div class="civicaformfield civicainputfield" data-fieldname="firstname"><div class="civicaQuestion"><label for="view82" id="CivicaFormLabel-2">Forename *</label></div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><input type="text" id="view82" data-bind="value: Value, valueUpdate: 'afterkeydown', enterKey: EnterPressed, attr: { disabled: Disabled, 'aria-labelledby': 'CivicaFormLabel-'  + GlobalID() }, style: { width: Width}, placeholder: PlaceholderText" aria-labelledby="CivicaFormLabel-2" placeholder=""></div></div>
     <h3>Buttons</h3>
     <p>All button styling should be consistent.  Use a[role="button"], input[type="submit"], input[type="button"], button, .btn </p>
     <p><a href="javascript:void(0)" data-bind="css: {'ui-state-disabled': Disabled }, hoverToggle: 'ui-state-hover'" role="button"><span class="ui-button-text" data-bind="text: LinkText">Next</span></a></p>
     <h3>Textarea Field</h3>
     <div class="civicaformfield civicainputfield" data-fieldname="CONTFU2"><div class="civicaQuestion"><label for="view118" id="CivicaFormLabel-5">Please give us a few details about what happened:</label></div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><textarea id="view118" type="text" data-bind="value: Value, valueUpdate: 'afterkeydown', attr: { disabled: IsDisabled, 'aria-labelledby': 'CivicaFormLabel-'  + GlobalID() }, style: { width: Width, height: Height}" aria-labelledby="CivicaFormLabel-5"></textarea></div></div>
    <h3>Radio Button</h3>
    <div class="civicaformfield civicainputfield" data-fieldname="Asylumseeker"><div class="civicaQuestion"><label for="view81" id="CivicaFormLabel-3">Are you an asylum seeker or have been sponsored to be in the UK? *</label></div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><div class="civicaRadioList" data-bind="foreach: PickListItems">
    <!-- ko if: $root.RenderHorizontal()==false -->
    <div>
        <input type="radio" data-bind="attr: { disabled: $root.Disabled, id: $root.FieldName() + $index(), name: $root.FieldName, value: Code, 'aria-labelledby': 'CivicaFormLabel-' + $root.GlobalID() + '-' + $index(), 'data-radionname': Desc }, checked: $root.Value" id="Asylumseeker0" name="Asylumseeker" value="N" aria-labelledby="CivicaFormLabel-3-0" data-radionname="No">
        <label data-bind="text: Desc, attr: { 'for': $root.FieldName() + $index(), id: 'CivicaFormLabel-' + $root.GlobalID() + '-' + $index() }" for="Asylumseeker0" id="CivicaFormLabel-3-0">No</label>
    </div>
    <!-- /ko -->    
    <!-- ko if: $root.RenderHorizontal()==true --><!-- /ko -->    

    <!-- ko if: $root.RenderHorizontal()==false -->
    <div>
        <input type="radio" data-bind="attr: { disabled: $root.Disabled, id: $root.FieldName() + $index(), name: $root.FieldName, value: Code, 'aria-labelledby': 'CivicaFormLabel-' + $root.GlobalID() + '-' + $index(), 'data-radionname': Desc }, checked: $root.Value" id="Asylumseeker1" name="Asylumseeker" value="Y" aria-labelledby="CivicaFormLabel-3-1" data-radionname="Yes">
        <label data-bind="text: Desc, attr: { 'for': $root.FieldName() + $index(), id: 'CivicaFormLabel-' + $root.GlobalID() + '-' + $index() }" for="Asylumseeker1" id="CivicaFormLabel-3-1">Yes</label>
    </div>
    <!-- /ko -->    
    <!-- ko if: $root.RenderHorizontal()==true --><!-- /ko -->    
</div>
</div></div>
    <h3>Labels</h3>
    <label for="view73" id="CivicaFormLabel-2">Which part of the building is the problem located? *</label>
    </div>
    <p><a href="#top">Back to top of page</a></p>


*/

input,
textarea,
keygen,
select,
button {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  min-width: 250px;
  min-height: 40px;
  padding-left: 15px;
  width: 80%;
  max-width: 500px;
}
textarea {
  min-height: 100px;
}
input[type=radio] {
  min-width: 30px;
  width: 30px;
  vertical-align: middle;
}
input[type=radio] + label {
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 15px;
  vertical-align: sub;
}
input[type=checkbox] {
  min-width: 30px;
  width: 30px;
  vertical-align: top;
  margin: 0px 0px 0px 0px;
}
label[aria-readonly=true] {
  border: 1px solid #ccc;
  padding: 1px 2px 1px 15px;
  background-color: #f1f1f1;
}
a[role="button"],
input[type="submit"],
input[type="button"],
button,
.btn {
  background-color: #093e52;
  color: #ffffff;
  box-sizing: border-box;
  line-height: 40px;
  min-height: 40px;
  display: inline-block;
  border: none;
  cursor: pointer;
  padding: 0 15px;
  margin-right: 8px;
  margin-top: 15px;
  text-align: center;
  width: auto;
  min-width: auto;
  white-space: normal;
  -webkit-appearance: none;
}
a[role="button"]:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover,
.btn:hover {
  background: #041b24;
  color: #ffffff;
}
a[role="button"].button-secondary,
input[type="submit"].button-secondary,
input[type="button"].button-secondary,
button.button-secondary,
.btn.button-secondary {
  background: #ffffff;
  color: #093e52;
  border: 1px solid #041b24;
}
a[role="button"].button-secondary:hover,
input[type="submit"].button-secondary:hover,
input[type="button"].button-secondary:hover,
button.button-secondary:hover,
.btn.button-secondary:hover {
  background: #041b24;
  color: #ffffff;
}
input[disabled="disabled"],
.disabled-btn {
  word-break: break-all;
  max-height: 100px;
  background-color: #f3f3f3;
  cursor: default;
}
input[disabled="disabled"]:hover,
.disabled-btn:hover {
  background: #f3f3f3;
}
.buttongroup {
  display: flex;
}
button.searchbutton {
  min-width: 60px;
  width: 60px;
  margin: 0;
}
input[type="color"] {
  vertical-align: top;
  min-width: 46px;
  width: 46px;
  padding: 0 8px;
}
.ui-corner-all {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
form {
  min-width: 320px;
}
label {
  clear: left;
  display: inline-block;
  margin-bottom: 8px;
  margin-top: 15px;
}
fieldset {
  border: none;
  margin: 0;
}
legend {
  padding-left: 0;
}
@media (max-width: 767px) {
  a[role="button"],
  input,
  select,
  textarea {
    width: 100%;
  }
}
h1 + p,
h2 + p {
  margin-top: 0;
}
input[type=checkbox],
input[type=radio] {
  margin-left: 0px;
}
input[type=CheckBox] + label,
input[type=radio] + label {
  display: inline;
  position: relative;
  padding-left: 10px;
}
input[type=CheckBox] + label {
  top: 8px;
}
input:not([type="radio"]):focus {
  outline: none;
  border: 3px solid #5598D3;
}
select:not([type="radio"]):focus {
  outline: none;
  border: 3px solid #5598D3;
}
#pageTitle {
  display: none !important;
}
.rangeslider {
  width: 75%;
  display: inline-block;
}
.rangemin,
.rangemax {
  width: 32px;
  display: inline-block;
  text-align: center;
}
input[type=range]::-ms-tooltip {
  display: none;
}
@media (max-width: 1281px) {
  input,
  textarea,
  keygen,
  select,
  button {
    padding: 0 15px;
    min-width: unset;
  }
}
/*
    <h2>Heading Elements</h2>
    <p>CSS File:<strong>element.headings.less</strong></p>
    <p>This file contains the element styles for headings e.g h1, h2.  It defines the size, weight and font.  H1 and H2 should not be used within the widgets.  These elements should be handled by the page content management system.  So H2 should be used to introduce the widget on the page and then H3, H4 can be used within the widgets.</p>
    <div style='border: 1px solid #000000 ;padding:15px'>
     For Example
     <h1>H1</h1>
     <h2>H2</h2>
     <h3>H3</h3>
     <h4>H4</h4>
     <h5>H5</h5>
    </div>  
    <p><a href="#top">Back to top of page</a></p>

*/

h1,
h2,
h3,
h4,
h5,
h6,
.civicamainheader,
.civicasubheader {
  font-family: "Ubuntu", sans-serif;
  font-weight: 500;
  color: #05242E;
  font-size: 26px;
  margin: 30px 0 15px 0;
}
h1,
h2,
.civicamainheader {
  margin: 30px 0 15px 0;
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child {
  margin-top: 15px;
}
h3,
h4,
h5,
h6,
.civicasubheader {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
}
h3,
.civicasubheader {
  margin: 15px 0 8px 0;
  font-size: 20px;
}
h4,
h5,
h6 {
  margin: 15px 0 0 0;
  font-size: 18px;
  font-weight: 600;
}
h1 {
  font-size: 38px;
}
.HistoryViewHeading {
  color: #05242E;
}
/*
    <h2 id='elelink'>Elements - Links</h2>
    <p>CSS File:<strong>element.links.less</strong></p>
    <p>This file contains the element styles for html links.  Links should all be consistent therefore should use the styling defined here. </p>
    <div style='border: 1px solid #000000 ;padding:15px'>
     For Example
    <p></p>
    <a href="">Search for applications</a>
    </div>  
    <p><a href="#top">Back to top of page</a></p>

*/

a {
  color: #267197;
  text-decoration: none;
  margin-bottom: 8px;
  display: inline-block;
}
a:hover {
  text-decoration: underline;
  cursor: pointer;
}
#skiptocontent a {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
#skiptocontent a:focus {
  position: static;
  width: auto;
  height: auto;
}
/*
    <h2 id='elequotes'>Elements - quotes</h2>
    <p>CSS File:<strong>element.quotes.less</strong></p>
    <p>This file contains the element styles for quotes and citations</p>
    <div style='border: 1px solid #000000 ;padding:15px'>
     For Example
    <p></p>
    
    <blockquote><h2>Aren’t all these quotes the same?</h2><p>No. First of all: quote ≠ block quote ≠ pull quote.</p><a href="https://www.smashingmagazine.com/2008/06/block-quotes-and-pull-quotes-examples-and-good-practices/">Sven Lennartz, Block Quotes and Pull Quotes: Examples and Good Practices</a>

    </div>  
    <p><a href="#top">Back to top of page</a></p>

*/

blockquote {
  margin-left: 60px;
}
blockquote:before {
  display: block;
  height: 0;
  content: "“";
  margin-left: -60px;
  font-size: 400%;
  font-family: Cochin, Georgia, "Times New Roman", serif;
  color: #c2c2c2;
}
blockquote a:before {
  content: "- ";
}
/*
    <h2 id='elequotes'>Elements - Emphasized</h2>
    <p>CSS File:<strong>element.emphasized.less</strong></p>
    <p>This file contains the element styles for emphasized elements</p>
    <div style='border: 1px solid #000000 ;padding:15px'>
     For Example
    <p></p>
    
   <em>this is emphasized</em>

    </div>  
    <p><a href="#top">Back to top of page</a></p>

*/

em {
  color: #6a6a6a;
  font-weight: bold;
}
/*
    <h2 id='eletab'>Elements - Tables and List</h2>
    <p>CSS File:<strong>element.tables-and-lists.less</strong></p>
    <p>This file contains the element styles for tables and list.</p> 
    <div style='border: 1px solid #000000;padding:15px'>
     For example
    <p>List</p>
    <ul>
     <li>List 1</li>
     <li>List 2</li>
    </ul>
    <p>Table</p>
    <table>
        <tr>
           <th>Col 1</th>
           <th>Col 2</th>
        </tr>
        <tr>
            <td>Some</td>
            <td>Notes</td>
        </tr>
    </table>
    </div>
    <p><a href="#top">Back to top of page</a></p>


*/

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
table {
  display: table;
  border-collapse: collapse;
  width: 100%;
}
th,
td {
  color: #3a3a3a;
  padding: 8px;
  text-align: left;
  vertical-align: top;
  /*width: 15%;*/

}
th {
  padding-top: 15px;
}
.pipe-separated li {
  display: inline;
  white-space: nowrap;
}
.pipe-separated li:after {
  content: '|';
  padding-left: 8px;
}
.pipe-separated li:last-of-type::after {
  content: none;
}
.bulletted li {
  font-family: "FontAwesome";
}
.bulletted li > * {
  font-family: "Open Sans", sans-serif;
}
.bulletted li {
  display: table;
}
.bulletted li::before {
  content: '\f054';
  font-family: "FontAwesome";
  padding-right: 15px;
  font-size: 16px;
  display: table-cell;
}
.time-line {
  list-style: none;
  padding: 0;
  padding-left: 1.5em;
  margin-bottom: 60px;
}
.time-line p {
  font-family: "nta", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 400;
  text-transform: none;
}
@media (max-width: 640px) {
  .time-line p {
    font-size: 14px;
    line-height: 1.14286;
  }
}
.time-line > * {
  display: block;
  padding: 0 0 0.7em 2em;
  margin: 0;
  text-transform: none;
  border-left: dotted 0.6em;
}
.time-line > *:before {
  content: "";
  display: block;
  border: 0.3em solid;
  background: white;
  width: 33px;
  margin: 0.5em -3.2em;
}
.time-line > *:first-child {
  padding-top: 0.5em;
  margin-top: 5em;
}
.time-line > *:first-child:before {
  border: 10px solid;
  height: 42px;
  width: 42px;
  border-radius: 1.2em;
  margin: -2.8em -3.45em;
}
.time-line > *:first-child h3 {
  margin-top: 1em;
}
.time-line > *:nth-child(1),
.time-line > *:nth-child(1):before {
  border-color: #f6c21d;
}
.time-line > *:nth-child(2),
.time-line > *:nth-child(2):before {
  border-color: #05242E;
}
.time-line > *:nth-child(3),
.time-line > *:nth-child(3):before {
  border-color: #D04379;
}
.time-line > *:nth-child(4),
.time-line > *:nth-child(4):before {
  border-color: #D04379;
}
.time-line > *:nth-child(5),
.time-line > *:nth-child(5):before {
  border-color: #05242E;
}
.time-line > *:nth-child(6),
.time-line > *:nth-child(6):before {
  border-color: #D04379;
}
.time-line > *:nth-child(7),
.time-line > *:nth-child(7):before {
  border-color: #D04379;
}
.time-line > * p {
  margin: 0.75em 0;
}
.time-line > * h3 {
  margin-top: -1.3em;
  border-bottom: 0;
}
.time-line > * h3 a {
  color: #0b0c0c;
  text-decoration: none;
}
.time-line > * h3 a:hover {
  text-decoration: underline;
}
.time-line .link-list h3 {
  margin-top: 1em;
}
.historyviewnorowsmessage {
  padding-left: 5px;
}
.civicaHistoryView th {
  background-color: rgba(0, 0, 0, 0.01);
}
.civicaHistoryView tbody tr:nth-child(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}
.civicaHistoryView tbody tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.01);
}
.civicaHistoryViewNonResize th {
  background-color: rgba(0, 0, 0, 0.01);
}
.civicaHistoryViewNonResize tbody tr:nth-child(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}
.civicaHistoryViewNonResize tbody tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.01);
}
.civicaHistoryViewDataTable th {
  background-color: rgba(0, 0, 0, 0.01);
}
.civicaHistoryViewDataTable tbody tr.odd {
  background-color: rgba(0, 0, 0, 0.05);
}
.civicaHistoryViewDataTable tbody tr.even {
  background-color: rgba(0, 0, 0, 0.01);
}
@media (max-width: 1068px) {
  .civicaHistoryView table,
  .civicaHistoryView thead,
  .civicaHistoryView tbody,
  .civicaHistoryView th,
  .civicaHistoryView td,
  .civicaHistoryView tr {
    display: block;
  }
  .civicaHistoryView thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .civicaHistoryView tr {
    border: 2px solid #ccc;
    margin-bottom: 5px;
  }
  .civicaHistoryView td {
    /* Behave  like a "row" */
    border: none;
    position: relative;
    padding-left: 50%;
    width: 100%;
  }
  .civicaHistoryView td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    content: attr(respcontent);
  }
  .civicaHistoryView tbody td:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.05);
  }
  .civicaHistoryView tbody td:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.01);
  }
}
/* 
 Objects are "formless", in other words invisible to the user, no cosmetics 
    Eg. wrappers, grid systems, etc. 
 This is the first layer of classes 
   Eg. list-inline, ui-list, etc. 
*/

/*
    <h2 id='paglay'>Object - Page Layout</h2>
    <p>CSS File:<strong>object.page-layouts.less</strong></p>
    <p>This file gives a bunch of classes to use for responsive layouts</p>
    <p>Layouts tend to be grouped into the following sizes</p>
    <p>Phones less than 768px  @breakpoint-phone</p>
    <p>Small device tablets greater than or equal to 768px @breakpoint-small</p>
    <p>Medium device desktops greater than or equal to 992px @breakpoint-medium</p>
    <p>Large device desktops greater than or equal 1200px @breakpoint-large</p>  
    <p><a href="#top">Back to top of page</a></p>

*/

.civica-content,
.civica-content-with-menu {
  padding-left: 15px;
  padding-right: 15px;
  margin-top: 15px;
  margin-bottom: 15px;
}
div.civica-menu {
  margin-left: 15px;
  padding: 0 15px 15px 15px;
}
@media (max-width: 767px) {
  div.civica-menu {
    margin-right: 15px;
  }
}
@media (min-width: 768px) {
  div.civica-content,
  .civica-content-with-menu {
    padding-left: 30px;
    padding-right: 30px;
    margin-top: 15px;
    margin-bottom: 15px;
  }
  div.civica-menu {
    padding: 0 30px 15px 30px;
    margin-top: 15px;
    margin-left: 30px;
  }
}
div.ensure {
  padding: 0 15px 15px 15px;
}
@media (max-width: 767px) {
  
}
@media (min-width: 768px) {
  div.ensure {
    padding: 0 30px 15px 30px;
  }
}
@media (min-width: 992px) {
  div.civica-content-with-menu {
    width: 72%;
    display: inline-block;
    vertical-align: top;
  }
  div.civica-menu {
    width: calc(28% - 15px);
    display: inline-block;
    margin-top: 15px;
    margin-left: 0;
  }
}
@media (min-width: 1200px) {
  div.civica-content-with-menu {
    width: 77%;
  }
  div.civica-menu {
    width: calc(23% - 15px);
  }
}
.civica-search-and-results-page {
  margin: 15px;
}
.civica-search-and-results-page > div:nth-child(2) > h2:first-of-type {
  margin-top: 0px;
}
@media (min-width: 768px) {
  .civica-search-and-results-page > div:nth-child(1) {
    width: 50%;
    display: inline-block;
    vertical-align: top;
  }
  .civica-search-and-results-page > div:nth-child(2) {
    width: 50%;
    display: inline-block;
  }
}
@media (min-width: 992px) {
  .civica-search-and-results-page > div:nth-child(1) {
    width: 50%;
  }
  .civica-search-and-results-page > div:nth-child(2) {
    width: 50%;
  }
}
@media (min-width: 1200px) {
  .civica-search-and-results-page > div:nth-child(1) {
    width: 40%;
  }
  .civica-search-and-results-page > div:nth-child(2) {
    width: 60%;
  }
}
.civica-content-in-columns {
  margin: 0 8px;
}
@media (min-width: 768px) {
  .civica-content-in-columns {
    margin: 0 30px;
  }
}
@media (min-width: 992px) {
  .civica-content-in-columns {
    _: ; -webkit-column-count: 2;
    _: ; -khtml-column-count: 2;
    _: ; -moz-column-count: 2;
    _: ; column-count: 2;
    margin: 15px 30px;
  }
}
@media (min-width: 1200px) {
  .civica-content-in-columns {
    _: ; -webkit-column-count: 3;
    _: ; -khtml-column-count: 3;
    _: ; -moz-column-count: 3;
    _: ; column-count: 3;
  }
  .civica-content-in-columns-max-2 {
    _: ; -webkit-column-count: 2;
    _: ; -khtml-column-count: 2;
    _: ; -moz-column-count: 2;
    _: ; column-count: 2;
  }
}
.civica-mainpage + * + .civica-content-in-columns h2:first-child,
.civica-mainpage + .civica-content-in-columns h2:first-child {
  margin-top: 0;
}
.civica-mainpage + * + .civica-content-in-columns ul,
.civica-mainpage + .civica-content-in-columns ul {
  margin-bottom: 15px;
}
.civica-content-with-menu .civica-content-in-columns,
.civica-content-with-menu.civica-content-in-columns {
  margin: 0;
}
@media (min-width: 1200px) {
  .civica-content-with-menu .civica-content-in-columns,
  .civica-content-with-menu.civica-content-in-columns {
    _: ; -webkit-column-count: 2;
    _: ; -khtml-column-count: 2;
    _: ; -moz-column-count: 2;
    _: ; column-count: 2;
  }
}
.civica-content-with-menu > h1 {
  margin-top: 0px;
}
.civica-content-in-columns > * {
  -webkit-column-break-inside: avoid;
  /* Chrome, Safari */
  page-break-inside: avoid;
  /* Theoretically FF 20+ */
  break-inside: avoid-column;
  /* IE 11 */
  display: table;
  /* Actually FF 20+ */

  width: 100%;
}
.civica-mainpage {
  margin: 0 8px;
  text-align: center;
}
.civica-mainpage input.searchbox {
  max-width: initial;
}
.civica-mainpage > div > a {
  margin-top: 15px;
}
@media (min-width: 768px) {
  .civica-mainpage {
    margin: 0 30px;
  }
}
@media (min-width: 992px) {
  .civica-mainpage {
    position: relative;
    height: 25vw;
    background: url("/media/main-page.jpg") no-repeat;
    background-size: cover;
    width: 100%;
    margin: 0;
    color: #F2F2F1;
  }
  .civica-mainpage > div {
    position: absolute;
    left: 25%;
    right: 25%;
    top: 25%;
    background: rgba(30, 30, 30, 0.8);
    padding: 0px 15px 15px 15px;
    border-radius: 8px;
  }
  .civica-mainpage > div a {
    color: #F2F2F1;
  }
  .civica-mainpage > div h1 {
    font-size: 4vw;
    text-align: center;
    color: white;
  }
  .civica-mainpage .civicafulltextsearch input {
    padding-left: 1vw;
    padding-right: 1vw;
    height: 4vw;
    font-size: 2vw;
    line-height: inherit;
    margin: 0;
    width: 90%;
  }
  .civica-mainpage .civicafulltextsearch {
    position: relative;
  }
  .civica-mainpage .civicafulltextsearch button {
    height: 100%;
    position: absolute;
    width: 10%;
  }
  .civica-mainpage .civicafulltextsearch button i {
    font-size: 2vw;
  }
  .civica-mainpage .civicafulltextsearch button {
    width: 5vw;
    line-height: inherit;
  }
}
@media (min-width: 1200px) {
  .civica-mainpage + div {
    width: 90%;
  }
  .civica-mainpage > div a {
    color: #F2F2F1;
  }
}
.civica-mainpage + div li {
  margin: 0;
}
.civica-mainpage .civicabusy > div {
  margin-top: 0;
}
.civica-mainpage .civica-loading {
  min-height: initial;
}
.civica-mainpage .busytext {
  color: transparent;
}
.civica-filter-and-results-page {
  margin: 15px;
}
@media (min-width: 768px) {
  .civica-filter-and-results-page > div:nth-child(1) {
    width: 15%;
    display: inline-block;
    vertical-align: top;
  }
  .civica-filter-and-results-page > div:nth-child(2) {
    width: 85%;
    display: inline-block;
  }
}
@media (min-width: 992px) {
  .civica-filter-and-results-page > div:nth-child(1) {
    width: 15%;
  }
  .civica-filter-and-results-page > div:nth-child(2) {
    width: 85%;
  }
}
@media (min-width: 1200px) {
  .civica-filter-and-results-page > div:nth-child(1) {
    width: 15%;
  }
  .civica-filter-and-results-page > div:nth-child(2) {
    width: 85%;
  }
}
.offpage {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.offpage.focusable:active,
.offpage.focusable:focus {
  position: static !important;
  clip: auto;
  overflow: visible;
  height: auto;
}
button.civica-collapsible {
  width: 100%;
  font-size: 14px;
  max-width: 100%;
  text-align: left;
  padding-left: 30px;
}
button.civica-collapsible:after {
  content: '\002B';
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}
button.active:after {
  content: "\2212";
}
div.civica-notes {
  padding: 0px 30px 0px 30px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  background-color: #f1f1f1;
  font-size: 12px;
}
/* 
 Components are the stuff of UI. Eg. buttons, special titles, etc. 
 These get much more explicitly named: eg. products-list, etc. 
 */

.TOC ol {
  list-style-type: none;
  counter-reset: toc1;
}
.TOC ol li::before {
  content: counter(toc1);
  counter-increment: toc1;
  padding-right: 30px;
}
.TOC ol li ol {
  counter-reset: toc2;
}
.TOC ol li ol li::before {
  content: counter(toc1) ' .' counter(toc2);
  counter-increment: toc2;
  padding-right: 30px;
}
.TOC ol li ol li ol {
  counter-reset: toc3;
}
.TOC ol li ol li ol li::before {
  content: counter(toc1) ' .' counter(toc2) ' .' counter(toc3);
  counter-increment: toc3;
  padding-right: 30px;
}
/*
    <h2 id='fontawe'>Font Awesome Icons</h2>
    <p>CSS File:<strong>component.fontawesome.less</strong></p>
    <p>This file contains styling associated with font awesome icons used within the Civica widgets.</p>
    <div style='border: 1px solid #000000;padding:15px'>
      For Example
    <p></p>
    <i class="fa fa-search"></i>
    </div>
    <p><a href="#top">Back to top of page</a></p>
   
*/

/*!
 *  Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */

/* FONT PATH
 * -------------------------- */

@font-face {
  font-family: 'FontAwesome';
  src: url('../../fonts/fontawesome-webfont.eot');
  src: url('../../fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), url('../../fonts/fontawesome-webfont.woff?v=4.0.3') format('woff'), url('../../fonts/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), url('../../fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
.fa {
  /* padding:0 @narrow-spacing;*/
  padding-left: 0px;
  padding-right: 5px;
}
.fa {
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
dt i.fa.fa-question-circle {
  margin-left: 10px;
}
/* makes the font 33% larger relative to the icon container */

.fa-lg {
  font-size: 1.333333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}
.fa-2x {
  font-size: 2em;
}
.fa-3x {
  font-size: 3em;
}
.fa-4x {
  font-size: 4em;
}
.fa-5x {
  font-size: 5em;
}
.fa-fw {
  width: 1.285714286em;
  text-align: center;
}
.fa-ul {
  padding-left: 0;
  margin-left: 2.142857143em;
  list-style-type: none;
}
.fa-ul > li {
  position: relative;
}
.fa-li {
  position: absolute;
  left: -2.142857143em;
  width: 2.142857143em;
  top: 0.142857143em;
  text-align: center;
}
.fa-li.fa-lg {
  left: -1.857142857em;
}
.fa-border {
  padding: 0.2em 0.25em 0.15em;
  border: solid 0.08em #eeeeee;
  border-radius: 0.1em;
}
.pull-right {
  float: right;
}
.pull-left {
  float: left;
}
.fa.pull-left {
  margin-right: 0.3em;
}
.fa.pull-right {
  margin-left: 0.3em;
}
.fa-spin {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@-ms-keyframes spin {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
.fa-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.fa-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.fa-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}
.fa-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.fa-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -moz-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  -o-transform: scale(1, -1);
  transform: scale(1, -1);
}
.fa-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}
.fa-stack-1x,
.fa-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}
.fa-stack-1x {
  line-height: inherit;
}
.fa-stack-2x {
  font-size: 2em;
}
.fa-inverse {
  color: #ffffff;
}
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */

.fa-glass:before {
  content: "\f000";
}
.fa-music:before {
  content: "\f001";
}
.fa-search:before {
  content: "\f002";
}
.fa-envelope-o:before {
  content: "\f003";
}
.fa-heart:before {
  content: "\f004";
}
.fa-star:before {
  content: "\f005";
}
.fa-star-o:before {
  content: "\f006";
}
.fa-user:before {
  content: "\f007";
}
.fa-film:before {
  content: "\f008";
}
.fa-th-large:before {
  content: "\f009";
}
.fa-th:before {
  content: "\f00a";
}
.fa-th-list:before {
  content: "\f00b";
}
.fa-check:before {
  content: "\f00c";
}
.fa-times:before {
  content: "\f00d";
}
.fa-search-plus:before {
  content: "\f00e";
}
.fa-search-minus:before {
  content: "\f010";
}
.fa-power-off:before {
  content: "\f011";
}
.fa-signal:before {
  content: "\f012";
}
.fa-gear:before,
.fa-cog:before {
  content: "\f013";
}
.fa-trash-o:before {
  content: "\f014";
}
.fa-home:before {
  content: "\f015";
}
.fa-file-o:before {
  content: "\f016";
}
.fa-clock-o:before {
  content: "\f017";
}
.fa-road:before {
  content: "\f018";
}
.fa-download:before {
  content: "\f019";
}
.fa-arrow-circle-o-down:before {
  content: "\f01a";
}
.fa-arrow-circle-o-up:before {
  content: "\f01b";
}
.fa-inbox:before {
  content: "\f01c";
}
.fa-play-circle-o:before {
  content: "\f01d";
}
.fa-rotate-right:before,
.fa-repeat:before {
  content: "\f01e";
}
.fa-refresh:before {
  content: "\f021";
}
.fa-list-alt:before {
  content: "\f022";
}
.fa-lock:before {
  content: "\f023";
}
.fa-flag:before {
  content: "\f024";
}
.fa-headphones:before {
  content: "\f025";
}
.fa-volume-off:before {
  content: "\f026";
}
.fa-volume-down:before {
  content: "\f027";
}
.fa-volume-up:before {
  content: "\f028";
}
.fa-qrcode:before {
  content: "\f029";
}
.fa-barcode:before {
  content: "\f02a";
}
.fa-tag:before {
  content: "\f02b";
}
.fa-tags:before {
  content: "\f02c";
}
.fa-book:before {
  content: "\f02d";
}
.fa-bookmark:before {
  content: "\f02e";
}
.fa-print:before {
  content: "\f02f";
}
.fa-camera:before {
  content: "\f030";
}
.fa-font:before {
  content: "\f031";
}
.fa-bold:before {
  content: "\f032";
}
.fa-italic:before {
  content: "\f033";
}
.fa-text-height:before {
  content: "\f034";
}
.fa-text-width:before {
  content: "\f035";
}
.fa-align-left:before {
  content: "\f036";
}
.fa-align-center:before {
  content: "\f037";
}
.fa-align-right:before {
  content: "\f038";
}
.fa-align-justify:before {
  content: "\f039";
}
.fa-list:before {
  content: "\f03a";
}
.fa-dedent:before,
.fa-outdent:before {
  content: "\f03b";
}
.fa-indent:before {
  content: "\f03c";
}
.fa-video-camera:before {
  content: "\f03d";
}
.fa-picture-o:before {
  content: "\f03e";
}
.fa-pencil:before {
  content: "\f040";
}
.fa-map-marker:before {
  content: "\f041";
}
.fa-adjust:before {
  content: "\f042";
}
.fa-tint:before {
  content: "\f043";
}
.fa-edit:before,
.fa-pencil-square-o:before {
  content: "\f044";
}
.fa-share-square-o:before {
  content: "\f045";
}
.fa-check-square-o:before {
  content: "\f046";
}
.fa-arrows:before {
  content: "\f047";
}
.fa-step-backward:before {
  content: "\f048";
}
.fa-fast-backward:before {
  content: "\f049";
}
.fa-backward:before {
  content: "\f04a";
}
.fa-play:before {
  content: "\f04b";
}
.fa-pause:before {
  content: "\f04c";
}
.fa-stop:before {
  content: "\f04d";
}
.fa-forward:before {
  content: "\f04e";
}
.fa-fast-forward:before {
  content: "\f050";
}
.fa-step-forward:before {
  content: "\f051";
}
.fa-eject:before {
  content: "\f052";
}
.fa-chevron-left:before {
  content: "\f053";
}
.fa-chevron-right:before {
  content: "\f054";
}
.fa-plus-circle:before {
  content: "\f055";
}
.fa-minus-circle:before {
  content: "\f056";
}
.fa-times-circle:before {
  content: "\f057";
}
.fa-check-circle:before {
  content: "\f058";
}
.fa-question-circle:before {
  content: "\f059";
}
.fa-info-circle:before {
  content: "\f05a";
}
.fa-crosshairs:before {
  content: "\f05b";
}
.fa-times-circle-o:before {
  content: "\f05c";
}
.fa-check-circle-o:before {
  content: "\f05d";
}
.fa-ban:before {
  content: "\f05e";
}
.fa-arrow-left:before {
  content: "\f060";
}
.fa-arrow-right:before {
  content: "\f061";
}
.fa-arrow-up:before {
  content: "\f062";
}
.fa-arrow-down:before {
  content: "\f063";
}
.fa-mail-forward:before,
.fa-share:before {
  content: "\f064";
}
.fa-expand:before {
  content: "\f065";
}
.fa-compress:before {
  content: "\f066";
}
.fa-plus:before {
  content: "\f067";
}
.fa-minus:before {
  content: "\f068";
}
.fa-asterisk:before {
  content: "\f069";
}
.fa-exclamation-circle:before {
  content: "\f06a";
}
.fa-gift:before {
  content: "\f06b";
}
.fa-leaf:before {
  content: "\f06c";
}
.fa-fire:before {
  content: "\f06d";
}
.fa-eye:before {
  content: "\f06e";
}
.fa-eye-slash:before {
  content: "\f070";
}
.fa-warning:before,
.fa-exclamation-triangle:before {
  content: "\f071";
}
.fa-plane:before {
  content: "\f072";
}
.fa-calendar:before {
  content: "\f073";
}
.fa-random:before {
  content: "\f074";
}
.fa-comment:before {
  content: "\f075";
}
.fa-magnet:before {
  content: "\f076";
}
.fa-chevron-up:before {
  content: "\f077";
}
.fa-chevron-down:before {
  content: "\f078";
}
.fa-retweet:before {
  content: "\f079";
}
.fa-shopping-cart:before {
  content: "\f07a";
}
.fa-folder:before {
  content: "\f07b";
}
.fa-folder-open:before {
  content: "\f07c";
}
.fa-arrows-v:before {
  content: "\f07d";
}
.fa-arrows-h:before {
  content: "\f07e";
}
.fa-bar-chart-o:before {
  content: "\f080";
}
.fa-twitter-square:before {
  content: "\f081";
}
.fa-facebook-square:before {
  content: "\f082";
}
.fa-camera-retro:before {
  content: "\f083";
}
.fa-key:before {
  content: "\f084";
}
.fa-gears:before,
.fa-cogs:before {
  content: "\f085";
}
.fa-comments:before {
  content: "\f086";
}
.fa-thumbs-o-up:before {
  content: "\f087";
}
.fa-thumbs-o-down:before {
  content: "\f088";
}
.fa-star-half:before {
  content: "\f089";
}
.fa-heart-o:before {
  content: "\f08a";
}
.fa-sign-out:before {
  content: "\f08b";
}
.fa-linkedin-square:before {
  content: "\f08c";
}
.fa-thumb-tack:before {
  content: "\f08d";
}
.fa-external-link:before {
  content: "\f08e";
}
.fa-sign-in:before {
  content: "\f090";
}
.fa-trophy:before {
  content: "\f091";
}
.fa-github-square:before {
  content: "\f092";
}
.fa-upload:before {
  content: "\f093";
}
.fa-lemon-o:before {
  content: "\f094";
}
.fa-phone:before {
  content: "\f095";
}
.fa-square-o:before {
  content: "\f096";
}
.fa-bookmark-o:before {
  content: "\f097";
}
.fa-phone-square:before {
  content: "\f098";
}
.fa-twitter:before {
  content: "\f099";
}
.fa-facebook:before {
  content: "\f09a";
}
.fa-github:before {
  content: "\f09b";
}
.fa-unlock:before {
  content: "\f09c";
}
.fa-credit-card:before {
  content: "\f09d";
}
.fa-rss:before {
  content: "\f09e";
}
.fa-hdd-o:before {
  content: "\f0a0";
}
.fa-bullhorn:before {
  content: "\f0a1";
}
.fa-bell:before {
  content: "\f0f3";
}
.fa-certificate:before {
  content: "\f0a3";
}
.fa-hand-o-right:before {
  content: "\f0a4";
}
.fa-hand-o-left:before {
  content: "\f0a5";
}
.fa-hand-o-up:before {
  content: "\f0a6";
}
.fa-hand-o-down:before {
  content: "\f0a7";
}
.fa-arrow-circle-left:before {
  content: "\f0a8";
}
.fa-arrow-circle-right:before {
  content: "\f0a9";
}
.fa-arrow-circle-up:before {
  content: "\f0aa";
}
.fa-arrow-circle-down:before {
  content: "\f0ab";
}
.fa-globe:before {
  content: "\f0ac";
}
.fa-wrench:before {
  content: "\f0ad";
}
.fa-tasks:before {
  content: "\f0ae";
}
.fa-filter:before {
  content: "\f0b0";
}
.fa-briefcase:before {
  content: "\f0b1";
}
.fa-arrows-alt:before {
  content: "\f0b2";
}
.fa-group:before,
.fa-users:before {
  content: "\f0c0";
}
.fa-chain:before,
.fa-link:before {
  content: "\f0c1";
}
.fa-cloud:before {
  content: "\f0c2";
}
.fa-flask:before {
  content: "\f0c3";
}
.fa-cut:before,
.fa-scissors:before {
  content: "\f0c4";
}
.fa-copy:before,
.fa-files-o:before {
  content: "\f0c5";
}
.fa-paperclip:before {
  content: "\f0c6";
}
.fa-save:before,
.fa-floppy-o:before {
  content: "\f0c7";
}
.fa-square:before {
  content: "\f0c8";
}
.fa-bars:before {
  content: "\f0c9";
}
.fa-list-ul:before {
  content: "\f0ca";
}
.fa-list-ol:before {
  content: "\f0cb";
}
.fa-strikethrough:before {
  content: "\f0cc";
}
.fa-underline:before {
  content: "\f0cd";
}
.fa-table:before {
  content: "\f0ce";
}
.fa-magic:before {
  content: "\f0d0";
}
.fa-truck:before {
  content: "\f0d1";
}
.fa-pinterest:before {
  content: "\f0d2";
}
.fa-pinterest-square:before {
  content: "\f0d3";
}
.fa-google-plus-square:before {
  content: "\f0d4";
}
.fa-google-plus:before {
  content: "\f0d5";
}
.fa-money:before {
  content: "\f0d6";
}
.fa-caret-down:before {
  content: "\f0d7";
}
.fa-caret-up:before {
  content: "\f0d8";
}
.fa-caret-left:before {
  content: "\f0d9";
}
.fa-caret-right:before {
  content: "\f0da";
}
.fa-columns:before {
  content: "\f0db";
}
.fa-unsorted:before,
.fa-sort:before {
  content: "\f0dc";
}
.fa-sort-down:before,
.fa-sort-asc:before {
  content: "\f0dd";
}
.fa-sort-up:before,
.fa-sort-desc:before {
  content: "\f0de";
}
.fa-envelope:before {
  content: "\f0e0";
}
.fa-linkedin:before {
  content: "\f0e1";
}
.fa-rotate-left:before,
.fa-undo:before {
  content: "\f0e2";
}
.fa-legal:before,
.fa-gavel:before {
  content: "\f0e3";
}
.fa-dashboard:before,
.fa-tachometer:before {
  content: "\f0e4";
}
.fa-comment-o:before {
  content: "\f0e5";
}
.fa-comments-o:before {
  content: "\f0e6";
}
.fa-flash:before,
.fa-bolt:before {
  content: "\f0e7";
}
.fa-sitemap:before {
  content: "\f0e8";
}
.fa-umbrella:before {
  content: "\f0e9";
}
.fa-paste:before,
.fa-clipboard:before {
  content: "\f0ea";
}
.fa-lightbulb-o:before {
  content: "\f0eb";
}
.fa-exchange:before {
  content: "\f0ec";
}
.fa-cloud-download:before {
  content: "\f0ed";
}
.fa-cloud-upload:before {
  content: "\f0ee";
}
.fa-user-md:before {
  content: "\f0f0";
}
.fa-stethoscope:before {
  content: "\f0f1";
}
.fa-suitcase:before {
  content: "\f0f2";
}
.fa-bell-o:before {
  content: "\f0a2";
}
.fa-coffee:before {
  content: "\f0f4";
}
.fa-cutlery:before {
  content: "\f0f5";
}
.fa-file-text-o:before {
  content: "\f0f6";
}
.fa-building-o:before {
  content: "\f0f7";
}
.fa-hospital-o:before {
  content: "\f0f8";
}
.fa-ambulance:before {
  content: "\f0f9";
}
.fa-medkit:before {
  content: "\f0fa";
}
.fa-fighter-jet:before {
  content: "\f0fb";
}
.fa-beer:before {
  content: "\f0fc";
}
.fa-h-square:before {
  content: "\f0fd";
}
.fa-plus-square:before {
  content: "\f0fe";
}
.fa-angle-double-left:before {
  content: "\f100";
}
.fa-angle-double-right:before {
  content: "\f101";
}
.fa-angle-double-up:before {
  content: "\f102";
}
.fa-angle-double-down:before {
  content: "\f103";
}
.fa-angle-left:before {
  content: "\f104";
}
.fa-angle-right:before {
  content: "\f105";
}
.fa-angle-up:before {
  content: "\f106";
}
.fa-angle-down:before {
  content: "\f107";
}
.fa-desktop:before {
  content: "\f108";
}
.fa-laptop:before {
  content: "\f109";
}
.fa-tablet:before {
  content: "\f10a";
}
.fa-mobile-phone:before,
.fa-mobile:before {
  content: "\f10b";
}
.fa-circle-o:before {
  content: "\f10c";
}
.fa-quote-left:before {
  content: "\f10d";
}
.fa-quote-right:before {
  content: "\f10e";
}
.fa-spinner:before {
  content: "\f110";
}
.fa-circle:before {
  content: "\f111";
}
.fa-mail-reply:before,
.fa-reply:before {
  content: "\f112";
}
.fa-github-alt:before {
  content: "\f113";
}
.fa-folder-o:before {
  content: "\f114";
}
.fa-folder-open-o:before {
  content: "\f115";
}
.fa-smile-o:before {
  content: "\f118";
}
.fa-frown-o:before {
  content: "\f119";
}
.fa-meh-o:before {
  content: "\f11a";
}
.fa-gamepad:before {
  content: "\f11b";
}
.fa-keyboard-o:before {
  content: "\f11c";
}
.fa-flag-o:before {
  content: "\f11d";
}
.fa-flag-checkered:before {
  content: "\f11e";
}
.fa-terminal:before {
  content: "\f120";
}
.fa-code:before {
  content: "\f121";
}
.fa-reply-all:before {
  content: "\f122";
}
.fa-mail-reply-all:before {
  content: "\f122";
}
.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
  content: "\f123";
}
.fa-location-arrow:before {
  content: "\f124";
}
.fa-crop:before {
  content: "\f125";
}
.fa-code-fork:before {
  content: "\f126";
}
.fa-unlink:before,
.fa-chain-broken:before {
  content: "\f127";
}
.fa-question:before {
  content: "\f128";
}
.fa-info:before {
  content: "\f129";
}
.fa-exclamation:before {
  content: "\f12a";
}
.fa-superscript:before {
  content: "\f12b";
}
.fa-subscript:before {
  content: "\f12c";
}
.fa-eraser:before {
  content: "\f12d";
}
.fa-puzzle-piece:before {
  content: "\f12e";
}
.fa-microphone:before {
  content: "\f130";
}
.fa-microphone-slash:before {
  content: "\f131";
}
.fa-shield:before {
  content: "\f132";
}
.fa-calendar-o:before {
  content: "\f133";
}
.fa-fire-extinguisher:before {
  content: "\f134";
}
.fa-rocket:before {
  content: "\f135";
}
.fa-maxcdn:before {
  content: "\f136";
}
.fa-chevron-circle-left:before {
  content: "\f137";
}
.fa-chevron-circle-right:before {
  content: "\f138";
}
.fa-chevron-circle-up:before {
  content: "\f139";
}
.fa-chevron-circle-down:before {
  content: "\f13a";
}
.fa-html5:before {
  content: "\f13b";
}
.fa-css3:before {
  content: "\f13c";
}
.fa-anchor:before {
  content: "\f13d";
}
.fa-unlock-alt:before {
  content: "\f13e";
}
.fa-bullseye:before {
  content: "\f140";
}
.fa-ellipsis-h:before {
  content: "\f141";
}
.fa-ellipsis-v:before {
  content: "\f142";
}
.fa-rss-square:before {
  content: "\f143";
}
.fa-play-circle:before {
  content: "\f144";
}
.fa-ticket:before {
  content: "\f145";
}
.fa-minus-square:before {
  content: "\f146";
}
.fa-minus-square-o:before {
  content: "\f147";
}
.fa-level-up:before {
  content: "\f148";
}
.fa-level-down:before {
  content: "\f149";
}
.fa-check-square:before {
  content: "\f14a";
}
.fa-pencil-square:before {
  content: "\f14b";
}
.fa-external-link-square:before {
  content: "\f14c";
}
.fa-share-square:before {
  content: "\f14d";
}
.fa-compass:before {
  content: "\f14e";
}
.fa-toggle-down:before,
.fa-caret-square-o-down:before {
  content: "\f150";
}
.fa-toggle-up:before,
.fa-caret-square-o-up:before {
  content: "\f151";
}
.fa-toggle-right:before,
.fa-caret-square-o-right:before {
  content: "\f152";
}
.fa-euro:before,
.fa-eur:before {
  content: "\f153";
}
.fa-gbp:before {
  content: "\f154";
}
.fa-dollar:before,
.fa-usd:before {
  content: "\f155";
}
.fa-rupee:before,
.fa-inr:before {
  content: "\f156";
}
.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
  content: "\f157";
}
.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
  content: "\f158";
}
.fa-won:before,
.fa-krw:before {
  content: "\f159";
}
.fa-bitcoin:before,
.fa-btc:before {
  content: "\f15a";
}
.fa-file:before {
  content: "\f15b";
}
.fa-file-text:before {
  content: "\f15c";
}
.fa-sort-alpha-asc:before {
  content: "\f15d";
}
.fa-sort-alpha-desc:before {
  content: "\f15e";
}
.fa-sort-amount-asc:before {
  content: "\f160";
}
.fa-sort-amount-desc:before {
  content: "\f161";
}
.fa-sort-numeric-asc:before {
  content: "\f162";
}
.fa-sort-numeric-desc:before {
  content: "\f163";
}
.fa-thumbs-up:before {
  content: "\f164";
}
.fa-thumbs-down:before {
  content: "\f165";
}
.fa-youtube-square:before {
  content: "\f166";
}
.fa-youtube:before {
  content: "\f167";
}
.fa-xing:before {
  content: "\f168";
}
.fa-xing-square:before {
  content: "\f169";
}
.fa-youtube-play:before {
  content: "\f16a";
}
.fa-dropbox:before {
  content: "\f16b";
}
.fa-stack-overflow:before {
  content: "\f16c";
}
.fa-instagram:before {
  content: "\f16d";
}
.fa-flickr:before {
  content: "\f16e";
}
.fa-adn:before {
  content: "\f170";
}
.fa-bitbucket:before {
  content: "\f171";
}
.fa-bitbucket-square:before {
  content: "\f172";
}
.fa-tumblr:before {
  content: "\f173";
}
.fa-tumblr-square:before {
  content: "\f174";
}
.fa-long-arrow-down:before {
  content: "\f175";
}
.fa-long-arrow-up:before {
  content: "\f176";
}
.fa-long-arrow-left:before {
  content: "\f177";
}
.fa-long-arrow-right:before {
  content: "\f178";
}
.fa-apple:before {
  content: "\f179";
}
.fa-windows:before {
  content: "\f17a";
}
.fa-android:before {
  content: "\f17b";
}
.fa-linux:before {
  content: "\f17c";
}
.fa-dribbble:before {
  content: "\f17d";
}
.fa-skype:before {
  content: "\f17e";
}
.fa-foursquare:before {
  content: "\f180";
}
.fa-trello:before {
  content: "\f181";
}
.fa-female:before {
  content: "\f182";
}
.fa-male:before {
  content: "\f183";
}
.fa-gittip:before {
  content: "\f184";
}
.fa-sun-o:before {
  content: "\f185";
}
.fa-moon-o:before {
  content: "\f186";
}
.fa-archive:before {
  content: "\f187";
}
.fa-bug:before {
  content: "\f188";
}
.fa-vk:before {
  content: "\f189";
}
.fa-weibo:before {
  content: "\f18a";
}
.fa-renren:before {
  content: "\f18b";
}
.fa-pagelines:before {
  content: "\f18c";
}
.fa-stack-exchange:before {
  content: "\f18d";
}
.fa-arrow-circle-o-right:before {
  content: "\f18e";
}
.fa-arrow-circle-o-left:before {
  content: "\f190";
}
.fa-toggle-left:before,
.fa-caret-square-o-left:before {
  content: "\f191";
}
.fa-dot-circle-o:before {
  content: "\f192";
}
.fa-wheelchair:before {
  content: "\f193";
}
.fa-vimeo-square:before {
  content: "\f194";
}
.fa-turkish-lira:before,
.fa-try:before {
  content: "\f195";
}
.fa-plus-square-o:before {
  content: "\f196";
}
.fa-input {
  font-family: FontAwesome, "Open Sans", sans-serif;
}
/*
    <h2 id='qtips'>Qtip</h2>
    <p>CSS File:<strong>component.qtip.less</strong></p>
    <p>This file contains the styling for the qtips.  These are used mostly in forms to identify mandatory fields.</p>  
    <p><a href="#top">Back to top of page</a></p>
  
*/

/*
 * qTip2 - Pretty powerful tooltips - v2.2.1
 * http://qtip2.com
 *
 * Copyright (c) 2014 
 * Released under the MIT licenses
 * http://jquery.org/license
 *
 * Date: Sat Sep 6 2014 09:55 EDT-0400
 * Plugins: tips viewport
 * Styles: core basic css3
 */

.qtip {
  position: absolute;
  left: -28000px;
  top: -28000px;
  display: none;
  max-width: 500px;
  min-width: 50px;
  font-size: 10.5px;
  line-height: 12px;
  direction: ltr;
  box-shadow: none;
  padding: 0;
}
.qtip-content {
  position: relative;
  padding: 5px 9px;
  overflow: hidden;
  text-align: left;
  word-wrap: break-word;
}
.qtip-titlebar {
  position: relative;
  padding: 5px 35px 5px 10px;
  overflow: hidden;
  border-width: 0 0 1px;
  font-weight: bold;
}
.qtip-titlebar + .qtip-content {
  border-top-width: 0 !important;
}
/* Default close button class */

.qtip-close {
  position: absolute;
  right: -9px;
  top: -9px;
  z-index: 11;
  /* Overlap .qtip-tip */
  cursor: pointer;
  outline: medium none;
  border: 1px solid transparent;
}
.qtip-titlebar .qtip-close {
  right: 4px;
  top: 50%;
  margin-top: -9px;
}
* html .qtip-titlebar .qtip-close {
  top: 16px;
}
/* IE fix */

.qtip-titlebar .ui-icon,
.qtip-icon .ui-icon {
  display: block;
  text-indent: -1000em;
  direction: ltr;
}
.qtip-icon,
.qtip-icon .ui-icon {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  text-decoration: none;
}
.qtip-icon .ui-icon {
  width: 18px;
  height: 14px;
  line-height: 14px;
  text-align: center;
  text-indent: 0;
  font: normal bold 10px/13px Tahoma, sans-serif;
  color: inherit;
  background: transparent none no-repeat -100em -100em;
}
/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */

/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */

/* Default tooltip style */

.qtip-default {
  border: 1px solid #F1D031;
  background-color: #FFFFA3;
  color: #555;
}
.qtip-default .qtip-titlebar {
  background-color: #FFEF93;
}
.qtip-default .qtip-icon {
  border-color: #CCC;
  background: #F1F1F1;
  color: #777;
}
.qtip-default .qtip-titlebar .qtip-close {
  border-color: #AAA;
  color: #111;
}
/*! Light tooltip style */

.qtip-light {
  background-color: white;
  border-color: #E2E2E2;
  color: #454545;
}
.qtip-light .qtip-titlebar {
  background-color: #f1f1f1;
}
/*! Dark tooltip style */

.qtip-dark {
  background-color: #505050;
  border-color: #303030;
  color: #f3f3f3;
}
.qtip-dark .qtip-titlebar {
  background-color: #404040;
}
.qtip-dark .qtip-icon {
  border-color: #444;
}
.qtip-dark .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}
/*! Cream tooltip style */

.qtip-cream {
  background-color: #FBF7AA;
  border-color: #F9E98E;
  color: #A27D35;
}
.qtip-cream .qtip-titlebar {
  background-color: #F0DE7D;
}
.qtip-cream .qtip-close .qtip-icon {
  background-position: -82px 0;
}
/*! Red tooltip style */

.qtip-red {
  background-color: #EBAFA3;
  border-color: #D95252;
  color: #912323;
}
.qtip-red .qtip-titlebar {
  background-color: #F06D65;
}
.qtip-red .qtip-close .qtip-icon {
  background-position: -102px 0;
}
.qtip-red .qtip-icon {
  border-color: #D95252;
}
.qtip-red .qtip-titlebar .ui-state-hover {
  border-color: #D95252;
}
/*! Green tooltip style */

.qtip-green {
  background-color: #CAED9E;
  border-color: #90D93F;
  color: #3F6219;
}
.qtip-green .qtip-titlebar {
  background-color: #B0DE78;
}
.qtip-green .qtip-close .qtip-icon {
  background-position: -42px 0;
}
/*! Blue tooltip style */

.qtip-blue {
  background-color: #E5F6FE;
  border-color: #ADD9ED;
  color: #5E99BD;
}
.qtip-blue .qtip-titlebar {
  background-color: #D0E9F5;
}
.qtip-blue .qtip-close .qtip-icon {
  background-position: -2px 0;
}
.qtip-shadow {
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
  box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}
/* Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */

.qtip-rounded,
.qtip-tipsy,
.qtip-bootstrap {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.qtip-rounded .qtip-titlebar {
  -moz-border-radius: 4px 4px 0 0;
  -webkit-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;
}
/* Youtube tooltip style */

.qtip-youtube {
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 0 3px #333;
  -moz-box-shadow: 0 0 3px #333;
  box-shadow: 0 0 3px #333;
  color: white;
  border: 0 solid transparent;
  background: #4A4A4A;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4A4A4A), color-stop(100%, black));
  background-image: -webkit-linear-gradient(top, #4A4A4A 0, black 100%);
  background-image: -moz-linear-gradient(top, #4A4A4A 0, black 100%);
  background-image: -ms-linear-gradient(top, #4A4A4A 0, black 100%);
  background-image: -o-linear-gradient(top, #4A4A4A 0, black 100%);
}
.qtip-youtube .qtip-titlebar {
  background-color: #4A4A4A;
  background-color: rgba(0, 0, 0, 0);
}
.qtip-youtube .qtip-content {
  padding: 0.75em;
  font: 12px arial, sans-serif;
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#4a4a4a, EndColorStr=#000000);
  -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);";
}
.qtip-youtube .qtip-icon {
  border-color: #222;
}
.qtip-youtube .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}
/* jQuery TOOLS Tooltip style */

.qtip-jtools {
  background: #232323;
  background: rgba(0, 0, 0, 0.7);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#717171), to(#232323));
  background-image: -moz-linear-gradient(top, #717171, #232323);
  background-image: -webkit-linear-gradient(top, #717171, #232323);
  background-image: -ms-linear-gradient(top, #717171, #232323);
  background-image: -o-linear-gradient(top, #717171, #232323);
  border: 2px solid #ddd;
  border: 2px solid #f1f1f1;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 0 12px #333;
  -moz-box-shadow: 0 0 12px #333;
  box-shadow: 0 0 12px #333;
}
/* IE Specific */

.qtip-jtools .qtip-titlebar {
  background-color: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171, endColorstr=#4A4A4A);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A)";
}
.qtip-jtools .qtip-content {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A, endColorstr=#232323);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323)";
}
.qtip-jtools .qtip-titlebar,
.qtip-jtools .qtip-content {
  background: transparent;
  color: white;
  border: 0 dashed transparent;
}
.qtip-jtools .qtip-icon {
  border-color: #555;
}
.qtip-jtools .qtip-titlebar .ui-state-hover {
  border-color: #333;
}
/* Cluetip style */

.qtip-cluetip {
  -webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  background-color: #D9D9C2;
  color: #111;
  border: 0 dashed transparent;
}
.qtip-cluetip .qtip-titlebar {
  background-color: #87876A;
  color: white;
  border: 0 dashed transparent;
}
.qtip-cluetip .qtip-icon {
  border-color: #808064;
}
.qtip-cluetip .qtip-titlebar .ui-state-hover {
  border-color: #696952;
  color: #696952;
}
/* Tipsy style */

.qtip-tipsy {
  background: black;
  background: rgba(0, 0, 0, 0.87);
  color: white;
  border: 0 solid transparent;
  font-size: 11px;
  font-family: 'Lucida Grande', sans-serif;
  font-weight: bold;
  line-height: 16px;
  text-shadow: 0 1px black;
}
.qtip-tipsy .qtip-titlebar {
  padding: 6px 35px 0 10px;
  background-color: transparent;
}
.qtip-tipsy .qtip-content {
  padding: 6px 10px;
}
.qtip-tipsy .qtip-icon {
  border-color: #222;
  text-shadow: none;
}
.qtip-tipsy .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}
/* Tipped style */

.qtip-tipped {
  border: 3px solid #959FA9;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-color: #F9F9F9;
  color: #454545;
  font-weight: normal;
  font-family: serif;
}
.qtip-tipped .qtip-titlebar {
  border-bottom-width: 0;
  color: white;
  background: #3A79B8;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#3A79B8), to(#2E629D));
  background-image: -webkit-linear-gradient(top, #3A79B8, #2E629D);
  background-image: -moz-linear-gradient(top, #3A79B8, #2E629D);
  background-image: -ms-linear-gradient(top, #3A79B8, #2E629D);
  background-image: -o-linear-gradient(top, #3A79B8, #2E629D);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8, endColorstr=#2E629D);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D)";
}
.qtip-tipped .qtip-icon {
  border: 2px solid #285589;
  background: #285589;
}
.qtip-tipped .qtip-icon .ui-icon {
  background-color: #FBFBFB;
  color: #555;
}
/**
 * Twitter Bootstrap style.
 *
 * Tested with IE 8, IE 9, Chrome 18, Firefox 9, Opera 11.
 * Does not work with IE 7.
 */

.qtip-bootstrap {
  /** Taken from Bootstrap body */
  font-size: 14px;
  line-height: 20px;
  color: #333333;
  /** Taken from Bootstrap .popover */
  padding: 1px;
  background-color: #ffffff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
.qtip-bootstrap .qtip-titlebar {
  /** Taken from Bootstrap .popover-title */
  padding: 8px 14px;
  margin: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}
.qtip-bootstrap .qtip-titlebar .qtip-close {
  /**
			 * Overrides qTip2:
			 * .qtip-titlebar .qtip-close{
			 *   [...]
			 *   right: 4px;
			 *   top: 50%;
			 *   [...]
			 *   border-style: solid;
			 * }
			 */
  right: 11px;
  top: 45%;
  border-style: none;
}
.qtip-bootstrap .qtip-content {
  /** Taken from Bootstrap .popover-content */
  padding: 9px 14px;
}
.qtip-bootstrap .qtip-icon {
  /**
		 * Overrides qTip2:
		 * .qtip-default .qtip-icon {
		 *   border-color: #CCC;
		 *   background: #F1F1F1;
		 *   color: #777;
		 * }
		 */
  background: transparent;
}
.qtip-bootstrap .qtip-icon .ui-icon {
  /**
			 * Overrides qTip2:
			 * .qtip-icon .ui-icon{
			 *   width: 18px;
			 *   height: 14px;
			 * }
			 */
  width: auto;
  height: auto;
  /* Taken from Bootstrap .close */
  float: right;
  font-size: 20px;
  font-weight: bold;
  line-height: 18px;
  color: #000000;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.qtip-bootstrap .qtip-icon .ui-icon:hover {
  /* Taken from Bootstrap .close:hover */
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
  filter: alpha(opacity=40);
}
/* IE9 fix - removes all filters */

.qtip:not(.ie9haxors) div.qtip-content,
.qtip:not(.ie9haxors) div.qtip-titlebar {
  filter: none;
  -ms-filter: none;
}
.qtip .qtip-tip {
  margin: 0 auto;
  overflow: hidden;
  z-index: 10;
}
/* Opera bug #357 - Incorrect tip position
	https://github.com/Craga89/qTip2/issues/367 */

x:-o-prefocus,
.qtip .qtip-tip {
  visibility: hidden;
}
.qtip .qtip-tip,
.qtip .qtip-tip .qtip-vml,
.qtip .qtip-tip canvas {
  position: absolute;
  color: #123456;
  background: transparent;
  border: 0 dashed transparent;
}
.qtip .qtip-tip canvas {
  top: 0;
  left: 0;
}
.qtip .qtip-tip .qtip-vml {
  behavior: url(../../#default#VML);
  display: inline-block;
  visibility: visible;
}
a.qtip-close.qtip-icon {
  height: 34px;
  width: 34px;
  border: 0px;
}
.qtip-close.qtip-icon {
  height: 34px;
  width: 34px;
  border: 0px;
}
/*
    <h2 id='datepick'>Datepicker</h2>
    <p>CSS File:<strong>component.datepicker.less</strong></p>
    <p>The styling here relates to the date picker used on forms.  The position should be absolute and not like in the example below.</p>
    <div style='border: 1px solid #000000 ;padding:15px'>
       For Example
        <div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="position: relative; left: 30px; z-index: 1; display: block;"><div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all"><a class="ui-datepicker-prev ui-corner-all" data-handler="prev" data-event="click" title="Prev"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a><a class="ui-datepicker-next ui-corner-all" data-handler="next" data-event="click" title="Next"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a><div class="ui-datepicker-title"><select class="ui-datepicker-month" data-handler="selectMonth" data-event="change"><option value="0">Jan</option><option value="1" selected="selected">Feb</option><option value="2">Mar</option><option value="3">Apr</option><option value="4">May</option><option value="5">Jun</option><option value="6">Jul</option><option value="7">Aug</option><option value="8">Sep</option><option value="9">Oct</option><option value="10">Nov</option><option value="11">Dec</option></select><select class="ui-datepicker-year" data-handler="selectYear" data-event="change"><option value="1866">1866</option><option value="1867">1867</option><option value="1868">1868</option><option value="1869">1869</option><option value="1870">1870</option><option value="1871">1871</option><option value="1872">1872</option><option value="1873">1873</option><option value="1874">1874</option><option value="1875">1875</option><option value="1876">1876</option><option value="1877">1877</option><option value="1878">1878</option><option value="1879">1879</option><option value="1880">1880</option><option value="1881">1881</option><option value="1882">1882</option><option value="1883">1883</option><option value="1884">1884</option><option value="1885">1885</option><option value="1886">1886</option><option value="1887">1887</option><option value="1888">1888</option><option value="1889">1889</option><option value="1890">1890</option><option value="1891">1891</option><option value="1892">1892</option><option value="1893">1893</option><option value="1894">1894</option><option value="1895">1895</option><option value="1896">1896</option><option value="1897">1897</option><option value="1898">1898</option><option value="1899">1899</option><option value="1900">1900</option><option value="1901">1901</option><option value="1902">1902</option><option value="1903">1903</option><option value="1904">1904</option><option value="1905">1905</option><option value="1906">1906</option><option value="1907">1907</option><option value="1908">1908</option><option value="1909">1909</option><option value="1910">1910</option><option value="1911">1911</option><option value="1912">1912</option><option value="1913">1913</option><option value="1914">1914</option><option value="1915">1915</option><option value="1916">1916</option><option value="1917">1917</option><option value="1918">1918</option><option value="1919">1919</option><option value="1920">1920</option><option value="1921">1921</option><option value="1922">1922</option><option value="1923">1923</option><option value="1924">1924</option><option value="1925">1925</option><option value="1926">1926</option><option value="1927">1927</option><option value="1928">1928</option><option value="1929">1929</option><option value="1930">1930</option><option value="1931">1931</option><option value="1932">1932</option><option value="1933">1933</option><option value="1934">1934</option><option value="1935">1935</option><option value="1936">1936</option><option value="1937">1937</option><option value="1938">1938</option><option value="1939">1939</option><option value="1940">1940</option><option value="1941">1941</option><option value="1942">1942</option><option value="1943">1943</option><option value="1944">1944</option><option value="1945">1945</option><option value="1946">1946</option><option value="1947">1947</option><option value="1948">1948</option><option value="1949">1949</option><option value="1950">1950</option><option value="1951">1951</option><option value="1952">1952</option><option value="1953">1953</option><option value="1954">1954</option><option value="1955">1955</option><option value="1956">1956</option><option value="1957">1957</option><option value="1958">1958</option><option value="1959">1959</option><option value="1960">1960</option><option value="1961">1961</option><option value="1962">1962</option><option value="1963">1963</option><option value="1964">1964</option><option value="1965">1965</option><option value="1966">1966</option><option value="1967">1967</option><option value="1968">1968</option><option value="1969">1969</option><option value="1970">1970</option><option value="1971">1971</option><option value="1972">1972</option><option value="1973">1973</option><option value="1974">1974</option><option value="1975">1975</option><option value="1976">1976</option><option value="1977">1977</option><option value="1978">1978</option><option value="1979">1979</option><option value="1980">1980</option><option value="1981">1981</option><option value="1982">1982</option><option value="1983">1983</option><option value="1984">1984</option><option value="1985">1985</option><option value="1986">1986</option><option value="1987">1987</option><option value="1988">1988</option><option value="1989">1989</option><option value="1990">1990</option><option value="1991">1991</option><option value="1992">1992</option><option value="1993">1993</option><option value="1994">1994</option><option value="1995">1995</option><option value="1996">1996</option><option value="1997">1997</option><option value="1998">1998</option><option value="1999">1999</option><option value="2000">2000</option><option value="2001">2001</option><option value="2002">2002</option><option value="2003">2003</option><option value="2004">2004</option><option value="2005">2005</option><option value="2006">2006</option><option value="2007">2007</option><option value="2008">2008</option><option value="2009">2009</option><option value="2010">2010</option><option value="2011">2011</option><option value="2012">2012</option><option value="2013">2013</option><option value="2014">2014</option><option value="2015">2015</option><option value="2016" selected="selected">2016</option></select></div></div><table class="ui-datepicker-calendar"><thead><tr><th scope="col" class="ui-datepicker-week-end"><span title="Sunday">Su</span></th><th scope="col"><span title="Monday">Mo</span></th><th scope="col"><span title="Tuesday">Tu</span></th><th scope="col"><span title="Wednesday">We</span></th><th scope="col"><span title="Thursday">Th</span></th><th scope="col"><span title="Friday">Fr</span></th><th scope="col" class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th></tr></thead><tbody><tr><td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-days-cell-over  ui-datepicker-today" data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default ui-state-highlight ui-state-hover" href="#">1</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">2</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">3</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">4</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">5</a></td><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">6</a></td></tr><tr><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">7</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">8</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">9</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">10</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">11</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">12</a></td><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">13</a></td></tr><tr><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">14</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">15</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">16</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">17</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">18</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">19</a></td><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">20</a></td></tr><tr><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">21</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">22</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">23</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">24</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">25</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">26</a></td><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">27</a></td></tr><tr><td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">28</a></td><td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2016"><a class="ui-state-default" href="#">29</a></td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td></tr></tbody></table></div>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/

.ui-datepicker-div > .ui-dialog-titlebar {
  background: #F2F2F1;
}
.ui-datepicker {
  width: 17em;
  padding: 0.2em 0.2em 0;
  display: none;
  background: white;
  opacity: 1;
  border: 1px solid #3a3a3a;
}
.ui-datepicker-header {
  position: relative;
  padding: 0.2em 0;
}
.ui-datepicker-prev,
.ui-datepicker-next {
  position: absolute;
  top: 2px;
  width: 1.8em;
  height: 1.8em;
}
.ui-datepicker-next {
  right: 8px;
}
.ui-datepicker-prev:before {
  left: 8px;
  content: '\f137';
  font-family: "FontAwesome";
  color: #3a3a3a;
  font-size: 23px;
  top: 7px;
  position: absolute;
}
.ui-datepicker-next:before {
  right: 2px;
  content: '\f138';
  font-family: "FontAwesome";
  color: #3a3a3a;
  font-size: 23px;
  top: 7px;
  position: absolute;
}
.ui-datepicker-prev span,
.ui-datepicker-next span {
  display: block;
  position: absolute;
  left: 25%;
  margin-left: -8px;
  top: 50%;
  margin-top: -8px;
}
.ui-datepicker-title {
  margin: 0 2.3em;
  line-height: 1.8em;
  text-align: center;
}
.ui-datepicker-title select {
  font-size: 1em;
  margin: 1px 0;
  min-width: 20px;
}
.ui-datepicker-prev .ui-icon,
.ui-datepicker-next .ui-icon {
  display: none;
}
select.ui-datepicker-month-year {
  width: 100%;
}
select.ui-datepicker-month,
select.ui-datepicker-year {
  width: 50%;
  padding: 8px 0;
  display: inline-block;
}
.ui-datepicker-buttonpane button {
  float: right;
  margin: 0.5em 0.2em 0.4em;
  cursor: pointer;
  padding: 0.2em 0.6em 0.3em 0.6em;
  width: auto;
  overflow: visible;
}
.ui-datepicker-buttonpane button.ui-datepicker-current {
  float: left;
}
.ui-datepicker-buttonpane {
  background-image: none;
  margin: 0.7em 0 0 0;
  padding: 0 0.2em;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}
/* with multiple calendars */

.ui-datepicker.ui-datepicker-multi {
  width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
  float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
  width: 95%;
  margin: 0 auto 0.4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
  width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
  width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
  width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
  border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
  clear: left;
}
.ui-datepicker-row-break {
  clear: both;
  width: 100%;
  font-size: 0;
}
/* RTL support */

.ui-datepicker-rtl {
  direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
  right: 2px;
  left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
  left: 2px;
  right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
  right: 1px;
  left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
  left: 1px;
  right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
  clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
  float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
  float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
  border-right-width: 0;
  border-left-width: 1px;
}
.ui-datepicker-trigger {
  display: inline;
  background-color: transparent;
  color: #267197;
  padding-left: 0px;
  padding-right: 0px;
  min-width: 35px;
}
.ui-datepicker-trigger i {
  font-size: 150%;
}
.ui-datepicker-trigger:hover {
  background-color: transparent;
  color: #0d2734;
}
.ui-datepicker-unselectable span.ui-state-default {
  text-decoration: line-through;
}
/*
    <h2 id='addpick'>Address Picker</h2>
    <p>CSS File: <strong>component.addresspicker.less</strong></p>
    <p>This file describes the styling used for the address picker. The widget displays the number of matches, the list of address and an option to add a new address.</p>
    <div style='border: 1px solid #000000;padding:15px'>
      For Example
    <div class="civicaaddressfinder">
    <div class="civicaaddressfinderheader">
        <div data-bind="if: HasNoResults"></div>
        <div data-bind="ifnot: HasNoResults">
            Matching addresses found: <span data-bind="text: Addresses().length">1</span>
        </div>
    </div>
    <div class="civicaaddressfinderresults" data-bind="foreach: DisplayedAddresses">
        <a class="addresserowlink ui-widget ui-state-defaultui-button-text-only" href="javascript:void(0);" data-bind="click: SelectAddress">
            <div class="ui-button-text" data-bind="text: FullAddress">Taxi House, Sovereign Road, Leeds, West Yorkshire, LS11 5DD</div>
        </a>
    </div>
    <div class="civicaaddressfinderpager" style="height: 0px;"></div>
    <div class="civicaaddressfinderaddbtn"><div data-bind="if: IsVisible"><a href="javascript:void(0)" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" data-bind="css: {'ui-state-disabled': Disabled }, hoverToggle: 'ui-state-hover'" role="button"><span class="ui-button-text" data-bind="text: LinkText">Add a new address</span></a></div></div>
</div>
</div>
    <p><a href="#top">Back to top of page</a></p>
*/

.CivicaAddressQuerySearch {
  margin-right: 8px;
}
.CivicaAddressQuerySearch input {
  width: 100%;
  margin: 10px 0 10px 0;
}
.civicaaddressfinder a.addresserowlink {
  display: block;
}
.civicaaddressfinderresults {
  height: 250px;
  width: 500px;
  overflow-y: scroll;
}
.civicaAnswer textarea {
  overflow: hidden;
  width: 250px;
  height: 130px;
}
/*
    <h2 id='accord'>Accordions</h2>
    <p>CSS File: <strong>component.accordian.less</strong></p>
    <p>This file describes the styling for the civica accordions.</p>
    <p>Accodions are used when large amounts of content needs to be displayed but there is a limited space on the screen.
    <div style='border: 1px solid #000000;padding:15px'>
     For example
    <div class="civicaaccordionheader ui-accordion-header ui-state-default ui-accordion-icons ui-corner-all" role="tab" id="ui-id-11" aria-controls="ui-id-12" aria-selected="false" aria-expanded="false" tabindex="0"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>
        <div class="civicasubheader" data-bind="msg: 'keyobject.CTXAccount.payment'">Payments</div>
    </div>
    </div>

    <p><a href="#top">Back to top of page</a></p>

*/

.civicaaccordionheader {
  border: 1px solid #c2c2c2;
  background-color: #F2F2F1;
  padding: 15px;
  display: flex;
  width: 100%;
  margin-top: 15px;
  cursor: pointer;
  align-items: baseline;
  flex-wrap: wrap;
}
.civicaaccordionheader > div {
  margin-left: 30px;
  white-space: nowrap;
}
.civicaaccordionheader > div:first-of-type {
  margin-left: 0;
}
.civicaaccordionheader .civicasubheader {
  margin: 0;
}
.civicaaccordionheader .civicaellipsisheader {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
/* Support for historic templates */

.ui-accordion .ui-accordion-header {
  display: block;
  cursor: pointer;
  position: relative;
  margin-top: 2px;
  padding: 0.5em 0.5em 0.5em 0.7em;
  min-height: 0;
  /* support: IE7 */
  border: 1px solid #ccc;
  background: #F8F7F7;
  font-weight: bold;
  color: #1c5571;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  position: absolute;
  left: 0.5em;
  top: 50%;
  margin-top: -8px;
}
.civicaaccordionheader {
  font-family: "FontAwesome";
}
.civicaaccordionheader > div {
  font-family: "Open Sans", sans-serif;
}
.civicaaccordionheader:before {
  font-family: "FontAwesome";
  content: '\f054';
  color: #05242E;
  display: table-cell;
  width: 30px;
}
.civicaaccordionheader.ui-accordion-header-active:before {
  content: '\f078';
}
.civicaaccordionheader.ui-accordion-header-active .civicaellipsisheader {
  text-overflow: inherit;
  white-space: inherit;
  overflow: inherit;
}
.civica-panel-group,
.civica-servicerequestitem .ui-accordion-content {
  border: 1px solid #c2c2c2;
  border-top: none;
  padding: 0 15px 15px 15px;
  display: table;
  width: 100%;
}
.civica-panel-group .civicasubheader {
  margin-top: 0;
  padding-top: 15px;
}
.ui-dialog[style] {
  border: 8px solid #267197;
  padding: 8px;
  position: fixed;
  box-sizing: border-box;
  background: #ffffff;
}
@media (max-width: 768px) {
  .ui-dialog[style] {
    max-height: 400px;
  }
}
.ui-dialog span.ui-button-text {
  display: none;
}
.ui-dialog button[title="close"] {
  position: absolute;
  right: 0px;
  background: #ffffff;
  color: #267197;
  line-height: 26px;
  height: 26px;
}
.ui-dialog button[title="close"]:hover {
  color: #1c536e;
}
.ui-dialog button[title="close"]:after {
  font-family: "FontAwesome";
  content: '\f00d';
}
/*
    <h2 id='alert'>Alerts</h2>
    <p>CSS File: <strong>component.alerts.less</strong></p>
    <p>These are the styles used for alerts. These alerts can be warning, errors and successful outcomes.</p>
    <div style='border: 1px solid #000000;padding:15px'>
     For Example - civica-error-alert styling
    <ul class="civica-alert"><li class="civica-error-alert">Password and Password Confirm must match</li><li class="civica-error-alert">Email Address and Email Address Confirm must match</li></ul>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/

.civica-alert {
  margin: 15px 0;
}
.civica-alert i {
  padding-left: 15px;
}
.civica-success-alert {
  color: #00ff00;
}
civica-warning-alert {
  color: #FFA500;
}
.civica-error-alert {
  color: #ff0000;
}
/*
    <h2 id='bread'>Breadcrumbs</h2>
    <p>CSS File: <strong>component.breadcrumb.less</strong></p>
    <p>Describes styling used for the breadcrumbs.</p>
    <div style='border: 1px solid #000000;padding:15px'>
     For Example
    <div class="hidden-small-only breadcrumb">
                <a href="/planning/">Planning</a>
                <span>/</span>
Search applications        </div>
</div>
    <p><a href="#top">Back to top of page</a></p>
*/

.breadcrumb {
  color: #3a3a3a;
  background-color: #F2F2F1;
  padding: 15px 0px 15px 30px;
}
.breadcrumb span {
  padding: 0 15px;
}
@media (max-width: 767px) {
  .breadcrumb a:after {
    display: block;
  }
}
/*
    <h2 id='civmenu'>Civica Menu</h2>
    <p>CSS File:<strong>component.civica-menu.less</strong></p>
    <p>The styling here relates to the "In this Section" (right side) Menu</p>
    <div style='border: 1px solid #000000;padding:15px'>
     <p>For Example</p>
    <div class="civica-menu">
	<h3>In this section</h3>
	    <ul>
		    <li><a href="">Pay now</a></li>
	    </ul>
    </div>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/

div.civica-menu {
  background-color: #1c5571;
  border-radius: 2px;
  display: inline-block;
}
.civica-menu h3 {
  color: #ffffff;
}
.civica-menu h2 {
  color: #ffffff;
}
.civica-menu a {
  color: #ffffff;
  display: table;
}
.civica-menu a:hover,
.civica-menu a:visited {
  text-decoration: none;
}
.civica-menu a:hover {
  color: #c2c2c2;
}
.civica-menu li {
  position: relative;
}
.civica-menu li:before {
  color: #f6c21d;
  font-family: "FontAwesome";
  content: '\f054';
  top: 8px;
  position: absolute;
}
.civica-menu a::before {
  content: '';
  font-family: "FontAwesome";
  color: #f6c21d;
  padding-right: 30px;
  font-size: 16px;
  display: table-cell;
}
@media (max-width: 767px) {
  
}
.myaccountpanel .btn {
  width: 200px;
}
.civica-lg2hrepair-keyno {
  display: none;
}
.civica-lg2hrent-keyno {
  display: none;
}
.civica-lg2hrent-title1,
.civica-lg2hrent-title2,
.civica-lg2hrent-title3,
.civica-lg2hrent-title4 {
  display: none;
}
.civica-lg2hrent-initial1,
.civica-lg2hrent-initial2,
.civica-lg2hrent-initial3,
.civica-lg2hrent-initial4 {
  display: none;
}
.civica-lg2hrent-forename1,
.civica-lg2hrent-forename2,
.civica-lg2hrent-forename3,
.civica-lg2hrent-forename4 {
  display: none;
}
.civica-lg2hrent-surname1,
.civica-lg2hrent-surname2,
.civica-lg2hrent-surname3,
.civica-lg2hrent-surname4 {
  display: none;
}
.civica-lg2hrent-personref1,
.civica-lg2hrent-personref2,
.civica-lg2hrent-personref3,
.civica-lg2hrent-personref4 {
  display: none;
}
.civica-lg2hrent-contact1dob,
.civica-lg2hrent-notesind,
.civica-lg2hrent-rentaccounttype,
.civica-lg2hrent-estateref,
.civica-lg2hrent-blockref {
  display: none;
}
.civica-lg2hrent-contact1name,
.civica-lg2hrent-contact2name,
.civica-lg2hrent-contact3name,
.civica-lg2hrent-contact4name {
  display: none;
}
.civica-lg2hrent-rebate,
.civica-lg2hrent-netrent,
.civica-lg2hrent-lastbalancedate,
.civica-lg2hrent-partyreference {
  display: none;
}
.civica-lg2hrent-rentaccountopened,
.civica-lg2hrent-rentaccountclosed {
  display: none;
}
.civica-servicerequestitem .content {
  padding-left: 15px;
}
.SecureMessageThread {
  margin: 10px 0;
  padding: 10px;
  border: 1.5px solid #000;
  border-radius: 10px;
}
.SecureMessageThread .fa-exclamation-circle {
  color: #b62b60;
}
/*
    <h2 id='help'>Help</h2>
    <p>CSS File:<strong>component.help.less</strong></p>
    <p>This file contains the styles for the help functionality (for instance on callscripts).  It requires the qtip styling to be included first.</p>
    <div style='border: 1px solid #000000;padding:15px'>
      For Example
    <div class="civicaQuestion"><label for="view85" id="CivicaFormLabel-6">Email address (used for login) *</label><a href="javascript:void(0);" aria-label="help" data-hasqtip="0"><i class="fa fa-question-circle"></i></a></div>
    <div id="qtip-1" class="qtip qtip-default ui-tooltip-light qtip-pos-tl qtip-focus" tracking="false" role="alert" aria-live="polite" aria-atomic="false" aria-describedby="qtip-1-content" aria-hidden="false" data-qtip-id="1" style="position:relative; z-index: 15001; top: initial; left: 356.766px; opacity: 1; display: block;"><div class="qtip-tip" style="border: 0px !important; width: 8px; height: 8px; line-height: 8px; left: -1px; top: -8px; background-color: transparent !important;"><canvas width="8" height="8" style="border: 0px !important; width: 8px; height: 8px; background-color: transparent !important;"></canvas></div><div class="qtip-titlebar"><div id="qtip-1-title" class="qtip-title" aria-atomic="true">Help</div><a class="qtip-close qtip-icon" title="Close tooltip" aria-label="Close tooltip" role="button"><span class="ui-icon ui-icon-close">×</span></a></div><div class="qtip-content" id="qtip-1-content" aria-atomic="true"><div class="helpprompttext" style="display: block; visibility: visible;">This is the number that updates will be sent to if you selected text message as your preferred method of contact.</div></div></div>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/

.ui-helper-hidden {
  display: none;
}
.helpprompttext,
.qtip-title {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  line-height: normal;
}
.helpprompttext {
  white-space: pre-wrap;
}
a.qtip-close,
a.qtip-close:hover,
.qtip-close .ui-icon-close,
.qtip-close .ui-icon-close:hover,
.qtip-default .qtip-icon {
  padding: 0;
  background: none;
  color: black;
  top: 8px;
  right: 8px;
  position: absolute;
}
.qtip-close .ui-icon-close {
  font-size: 26px;
  line-height: normal;
  background: none;
  padding: 0;
}
/*
    <h2 id='advsearch'>Advanced Search</h2>
    <p>CSS File:<strong>component.keyobject-advanced-search.less</strong></p>
    <p>This file contains the styles for the advance keyobject search functionality</p>
    <p>All available keyobject search fields are displayed as default.  If a search field needs to be hidden, it can be done by following the steps belows:</p>
    <ol>
    <li>From the advance search page, right click on the label of the field and select "Inspect" in Chome or "Inspect Element" in IE.</li>
    <li>This will open up the developer tools. In the elements tab you will see the label highlighed. Above the label you will see a div with class 'civicaQuestion'. Two divs above this is a div that has two class names. One of the class name is "civica-input" and the other class name is unique to the search field.</li>
    <li>At this div level a style can be added to hide the search fields (e.g. display:none;) using the unique class name e.g. civicakeyobjectsearch-appplancase-appealref.</li>
    </ol>
    <p><a href="#top">Back to top of page</a></p>
   
*/

.civicakeyobjectadvancedsearch button:first-of-type {
  margin-top: 0px;
}
.civicakeyobjectadvancedsearch {
  display: flex;
  flex-wrap: wrap;
  max-width: 500px;
}
.civicakeyobjectadvancedsearch > div {
  flex-basis: 100%;
}
@media (min-width: 992px) {
  .civicakeyobjectadvancedsearch > div[class$="datefrom"],
  .civicakeyobjectadvancedsearch > div[class$="dateto"] {
    flex-basis: auto;
  }
  .civicakeyobjectadvancedsearch > div[class$="datefrom"] label {
    max-width: 170px;
    width: 170px;
    white-space: nowrap;
  }
  .civicakeyobjectadvancedsearch > div[class$="datefrom"] input {
    width: 120px;
    min-width: 120px;
  }
  .civicakeyobjectadvancedsearch > div[class$="dateto"] label {
    display: none;
  }
  .civicakeyobjectadvancedsearch > div[class$="dateto"] input {
    width: 120px;
    min-width: 120px;
  }
  .civicakeyobjectadvancedsearch > div[class$="dateto"] div.civicaQuestion {
    height: 50px;
  }
  .civicakeyobjectadvancedsearch > div[class$="dateto"] .civicaAnswer::before {
    content: "to";
    padding-right: 15px;
  }
}
/*
    <h2 id='busy'>Busy indicator</h2>
    <p>CSS File:<strong>component.busy-indicator.less</strong></p>
    <p>This file contains the styling associated with the busy icon.</p>
    <p><a href="#top">Back to top of page</a></p>
*/

.civicabusy {
  background-color: white;
  text-align: center;
  z-index: 999999;
  display: none;
}
.civicabusy > div {
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
}
.civicabusy > div > p {
  margin-top: 0px;
}
.civica-loading {
  min-height: 60px;
  min-width: 100px;
  overflow: hidden;
}
/*
    <h2>Civica Form</h2>
    <p>CSS File:<strong>component.civica-form.less</strong></p>
    <p>This is extra specific styling for civica forms.  The file holds styling overrides.  For example the date field length - it has a class of hasDatepicker.</p>
    <div div style='border: 1px solid #000000;padding:15px'>
     For Example
   <div class="civicaformfield civicainputfield" data-fieldname="date1"><div class="civicaQuestion"><label for="view194" id="CivicaFormLabel-13">Date</label></div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><input id="view194" type="text" maxlength="11" data-bind="value: Value, valueUpdate: 'afterkeydown',enterKey: EnterPressed, attr: { disabled: IsDisabled, 'aria-labelledby': 'CivicaFormLabel-'  + GlobalID()}, style: { width: Width, 'padding-left':'3px'}, placeholder: PlaceholderText" aria-labelledby="CivicaFormLabel-13" placeholder="" class="hasDatepicker" style="padding-left: 3px;"><button type="button" aria-label="open calender" class="ui-datepicker-trigger"><i class="fa fa-calendar fa-2x"></i></button></div></div>
    </div>
    <p><a href="#top">Back to top of page</a></p>
*/

.hasDatepicker {
  width: 190px;
  min-width: 140px;
}
.civicaaddressfinderheader {
  margin: 15px 0;
}
.civicaformfields fieldset legend {
  /*display: none;*/
  position: absolute;
  clip: rect(0 0 0 0);
}
.civicaQuestion > label {
  font-weight: 600;
}
.civicaAnswer > label {
  margin-top: 8px;
}
.civicaformfield > div[disabled='disabled']::after {
  content: url(/css/images/ajax-loader.gif);
  padding-left: 10px;
}
.civicaforminlinefield {
  display: inline-block;
}
.civicafileuploadinput {
  display: none !important;
}
.civicafileupload .civicafileuploadinputdiv a {
  z-index: 2;
}
.civicafileupload .civicafileactionbutton {
  overflow: hidden;
  margin-bottom: 0;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.civicafileupload .civicafileprogress {
  height: 20px;
  margin-bottom: 5px;
  margin-top: 5px;
  overflow: hidden;
  max-width: 500px;
  background-color: #c2c2c2;
}
.civicafileupload .civicafileprogress .civicafileprogressbar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 16px;
  line-height: 20px;
  color: #05242E;
  text-align: center;
  background-color: #05242E;
  -webkit-transition: width 0.6s ease;
  transition: width 0.6s ease;
}
.civicafileupload .civicafileprogress .civicafileprogressbarsuccess {
  background-color: #05242E;
}
.civicafileupload .civicafile {
  clear: left;
  padding-top: 8px;
  margin-bottom: 5px;
  margin-top: 5px;
}
.addrObjectList span {
  font-weight: bold;
}
.addrObjectList .rowOrderList {
  clear: both;
  width: 100%;
}
.addrObjectList .rowOrderList .col_lg_xs_6 {
  width: 50%;
  float: left;
}
.civicaQuestion > dt {
  font-weight: 600;
  padding-top: 18px;
}
.civicaAnswer > dd {
  margin-inline-start: 0;
}
.callScriptForm > .civicaForm > .civicaformfields > div {
  margin-bottom: 25px;
}
.civicaAnswer.radio {
  width: auto;
  display: inline-block;
}
/*
    <h2 id='kov'>KeyObject Viewer</h2>
    <p>CSS File: <strong>component-civica-keyobject-viewer.less</strong></p>
    <p>This file contains styling associated with the keyobject viewer.</p>
    <div style='border: 1px solid #000000;padding:15px'>
      For Example
      <div class="civicakeyobjectviewer" data-bind="showbusy: ShowBusyEnabled">
    <!-- ko ifnot:HasKeyObject --><!-- /ko -->
    <!-- ko if: HasKeyObject-->
    <div class="civica-keyobject-details">
        <!-- ko if:ShowHeader -->
        <div class="civicamainheader" data-bind="text: HeaderText">Report it case</div>
        <!-- /ko -->
        <div class="row">
            <div class="col-md-9 col-sm-9 ui-accordion ui-widget ui-helper-reset" data-bind="civicaaccordion: { 'header': '.civicaaccordionheader', 'heightStyle': 'Content', 'active': ActiveAccordian(), collapsible : true}" role="tablist">
                <!-- ko foreach: Components-->
                <!-- ko if:Title --><!-- /ko -->
                <!-- ko if:ControllerName -->
                <div data-bind="controller: ControllerName, controllerOptions: {KeyObject: $root.KeyObject().model()}, controllerModel: ControllerModel(), css: {'civica-panel-group': IsCollapsible()}"><div><div data-bind="css: DetailsClass" class="civica-keyobject-fulldetails">        
    <!-- ko if:(KeyObjectTypeDescription()!=null) --><!-- /ko -->
    <!-- ko foreach:DisplayItems-->
    <div class="civicadetail">
        <!-- ko if: Label() -->
        <div class="civicasubheader civica-reportitcase-casereference" data-bind="css: CssClass, text: Label"><div></div>Reference</div>
        <!-- /ko -->
        <!-- ko ifnot:($index()===1 && $parent.KeyObjectTypeDescription()!=null) -->
        <div class="civicadetailtext civica-reportitcase-casereference" data-bind="css: CssClass, textwithdefault: Value, defaultValue: '-'">2014/08/00106</div>
        <!-- /ko -->
        <!-- ko if:AlertClass --><!-- /ko -->
    </div>
    
    <div class="civicadetail">
        <!-- ko if: Label() -->
        <div class="civicasubheader civica-reportitcase-casetype" data-bind="css: CssClass, text: Label">Type</div>
        <!-- /ko -->
        <!-- ko ifnot:($index()===1 && $parent.KeyObjectTypeDescription()!=null) -->
        <div class="civicadetailtext civica-reportitcase-casetype" data-bind="css: CssClass, textwithdefault: Value, defaultValue: '-'">Graffiti - Offensive</div>
        <!-- /ko -->
        <!-- ko if:AlertClass --><!-- /ko -->
    </div>
    
    <div class="civicadetail">
        <!-- ko if: Label() -->
        <div class="civicasubheader civica-reportitcase-casestatus" data-bind="css: CssClass, text: Label">Status</div>
        <!-- /ko -->
        <!-- ko ifnot:($index()===1 && $parent.KeyObjectTypeDescription()!=null) -->
        <div class="civicadetailtext civica-reportitcase-casestatus" data-bind="css: CssClass, textwithdefault: Value, defaultValue: '-'">Active</div>
        <!-- /ko -->
        <!-- ko if:AlertClass --><!-- /ko -->
    </div>
    
    <div class="civicadetail">
        <!-- ko if: Label() -->
        <div class="civicasubheader civica-reportitcase-casedescription" data-bind="css: CssClass, text: Label">Description</div>
        <!-- /ko -->
        <!-- ko ifnot:($index()===1 && $parent.KeyObjectTypeDescription()!=null) -->
        <div class="civicadetailtext civica-reportitcase-casedescription" data-bind="css: CssClass, textwithdefault: Value, defaultValue: '-'">Someone has written some graffiti on the gable end of my house</div>
        <!-- /ko -->
        <!-- ko if:AlertClass --><!-- /ko -->
    </div>
    <!-- /ko -->              
</div>
</div></div>
                <!-- /ko -->
                <!-- ko if:WidgetName --><!-- /ko -->
                
                <!-- ko if:Title -->
                <div data-bind="css: {civicaaccordionheader: Collapsible()}" class="civicaaccordionheader ui-accordion-header ui-state-default ui-corner-all ui-accordion-icons" role="tab" id="ui-id-5" aria-controls="ui-id-6" aria-selected="false" aria-expanded="false" tabindex="0"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>
                    <!-- ko if: Collapsible() -->
                    
                    <!-- /ko -->
                    <div class="civicasubheader civicahideheader" data-bind="text: Title, attr: { 'data-civicatitle': Title }" data-civicatitle="Location">Location</div>
                </div>
                <!-- /ko -->
                <!-- ko if:ControllerName -->
                <div data-bind="controller: ControllerName, controllerOptions: {KeyObject: $root.KeyObject().model()}, controllerModel: ControllerModel(), css: {'civica-panel-group': IsCollapsible()}" class="civica-panel-group ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-id-6" aria-labelledby="ui-id-5" role="tabpanel" aria-hidden="true" style="display: none;"><div><div class="civicaAnswer" data-bind="attr: { disabled: IsRefreshing} "><div class="civicagis">
    <input id="caseLocation" type="text" data-bind="value: Value" style="display:none;">
    <div id="civica-gis-viewer-openlayersviewer">
        <div id="map" class="map" style="display: block;">
        <div class="ol-viewport" style="position: relative; overflow: hidden; width: 100%; height: 100%; touch-action: none;"><canvas class="ol-unselectable" style="width: 100%; height: 100%; display: none;" width="979" height="494"></canvas><div class="ol-overlaycontainer"></div><div class="ol-overlaycontainer-stopevent"><div class="ol-overlay-container" style="position: absolute; display: none;"><div id="popup-existing" class="ol-popup">
            <a href="#" aria-label="close" id="popup-closer-existing" class="ol-popup-closer"></a>
            <div id="popup-content-existing"></div>
        </div></div><div class="ol-overlay-container" style="position: absolute; display: none;"><div id="popup" class="ol-popup">
            <a href="#" aria-label="close" id="popup-closer" class="ol-popup-closer"></a>
            <div id="popup-content"><p>Your Pin</p>
                <a href="#" id="popup-deleter" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" data-bind="hoverToggle: 'ui-state-hover'" role="button">
                    <span class="ui-button-text">Remove</span>
                </a>
            </div>            
        </div></div><div class="ol-zoom ol-unselectable ol-control"><button class="ol-zoom-in" type="button" title="Zoom in">+</button><button class="ol-zoom-out" type="button" title="Zoom out">−</button></div><div class="ol-rotate ol-unselectable ol-control ol-hidden"><button class="ol-rotate-reset" type="button" title="Reset rotation"><span class="ol-compass" style="transform: rotate(0rad);">⇧</span></button></div></div></div></div>
        
        
    </div>
</div>
</div></div></div>
                <!-- /ko -->
                <!-- ko if:WidgetName --><!-- /ko -->
                
                <!-- ko if:Title -->
                <div data-bind="css: {civicaaccordionheader: Collapsible()}" class="civicaaccordionheader ui-accordion-header ui-state-default ui-corner-all ui-accordion-icons" role="tab" id="ui-id-7" aria-controls="ui-id-8" aria-selected="false" aria-expanded="false" tabindex="-1"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>
                    <!-- ko if: Collapsible() -->
                    
                    <!-- /ko -->
                    <div class="civicasubheader civicahideheader" data-bind="text: Title, attr: { 'data-civicatitle': Title }" data-civicatitle="Related Documents">Related Documents</div>
                </div>
                <!-- /ko -->
                <!-- ko if:ControllerName --><!-- /ko -->
                <!-- ko if:WidgetName -->
                <div data-bind="widget:  Civica.jQuery.extend({ widgetName: WidgetName() }, WidgetOptions()), css: {'civica-panel-group': IsCollapsible()}" class="civica-panel-group ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-id-8" aria-labelledby="ui-id-7" role="tabpanel" aria-hidden="true" style="display: none;"><div class="civicadocumentlist"><!--<div class="civica-doclisthead civicasubheader">Documents</div>-->
<div data-bind="showbusy: ShowBusyEnabled" class="">
    <div data-bind="if: HasDocuments"></div>
    <!-- ko ifnot: HasDocuments() -->
    <div data-bind="if: HasError">
        <div data-bind="msg: 'widget.documentlist.error'">An error occured getting the documents for this item.</div>
    </div>
    <div data-bind="ifnot: HasError"></div>
    <!-- /ko -->
</div>
</div></div>
                <!-- /ko -->
                <!-- /ko -->
            </div>                       
            <!-- ko if: ShowKeyObjectActionLinks--><!-- /ko -->
        </div>
    </div>
    <!-- /ko -->    
</div>

    </div>

<p><a href="#top">Back to top of page</a></p>
*/

.civicakeyobjectlistcount {
  margin-bottom: 8px;
}
.civicakeyobjectctxaccountalert {
  display: none;
}
.civica-ctxaccount-account-alertstatus + div.fa {
  display: none;
}
.civicakeyobjectnndraccalertsymbols {
  display: none;
}
a.civica-listentry-accountlistentry {
  margin-top: 15px;
  padding: 0;
  display: block;
}
a.civica-listentry-accountlistentry.tenancy {
  display: inline-block;
}
p.civica-listentry-accountlistentry {
  margin-top: 8px;
  margin-bottom: 15px;
}
.myaccountpanel .civica-keyobject-details .civicamainheader:first-child {
  display: none;
}
.civica-keyobject-details .civicamainheader:first-child {
  margin-top: 0px;
}
.civicadetail {
  -webkit-column-break-inside: avoid;
  /* Chrome, Safari */
  page-break-inside: avoid;
  /* Theoretically FF 20+ */
  break-inside: avoid-column;
  /* IE 11 */
  display: table;
  /* Actually FF 20+ */

}
@media (min-width: 992px) {
  .civica-keyobject-fulldetails {
    _: ; -webkit-column-width: 300px;
    _: ; -khtml-column-width: 300px;
    _: ; -moz-column-width: 300px;
    _: ; column-width: 300px;
  }
}
@media (max-width: 767px) {
  .civica-keyobject-details thead {
    display: none;
  }
  .civica-keyobject-details tr td {
    display: block;
    padding: 0;
  }
  .civica-keyobject-details tr td:first-child {
    padding-top: 15px;
  }
}
.civicakeyobjectviewer a {
  margin-top: 15px;
}
.civicakeyobjectviewer .map {
  height: 300px;
}
.ui-icon-triangle-1-s {
  background-position: -65px -16px;
}
.ui-icon-triangle-1-e {
  background-position: -32px -16px;
}
.ui-accordion .ui-accordion-header {
  display: block;
  cursor: pointer;
  position: relative;
  margin-top: 2px;
  padding: 0.5em 0.5em 0.5em 0.7em;
  min-height: 0;
  /* support: IE7 */
  border: 1px solid #ccc;
  background: #f6f6f6 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAGQEAAAAAAao4lEAAAAAmJLR…RkYXRlOm1vZGlmeQAyMDE1LTAyLTE1VDA3OjM1OjAyKzAwOjAwXMG6IwAAAABJRU5ErkJggg==) 50% 50% repeat-x;
  font-weight: bold;
  color: #1c5571;
}
.ui-icon {
  background-image: url(../../images/ui-icons_454545_256x240.png)/*{iconsActive}*/;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  position: absolute;
  left: 0.5em;
  top: 50%;
  margin-top: -8px;
}
.ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
}
.ui-widget-content {
  border: 1px solid #ddd;
  background-color: #f4f4f4;
  margin-bottom: 10px;
  padding: 8px;
}
/*
    <h2 id='docv'>Document Viewer</h2>
    <p>CSS File:<strong>component.document-viewer.less</strong></p>
    <p>This file contains the style associated with the document viewer.</p>
    <p><a href="#top">Back to top of page</a></p>
   
*/

.documentviewerhead {
  margin-bottom: 15px;
}
.documentviewerviewer {
  background: #F2F2F1;
}
.documentviewerplanemail {
  background-color: #ffffff;
  min-height: 300px;
  padding: 8px;
}
.documentviewerplanemailbody {
  padding: 0;
  margin: 0;
}
.documentvieweremailframe {
  border: none;
  width: 100%;
  border-top: 1px solid black;
}
.CivicaDocViewer-tb-scale {
  margin-left: 10px;
}
.CivicaDocViewer-dzco {
  z-index: 5000;
  position: absolute;
}
.civica-carousel {
  width: 50%;
  height: 250px;
  position: relative;
  overflow: hidden;
  margin-left: auto;
  margin-right: auto;
}
.civica-carouselslider {
  width: 30%;
  margin-left: 10%;
  position: relative;
  border-bottom-color: grey;
  z-index: 100;
  opacity: 0.5;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 5px;
}
.documentviewerviewer {
  background: #ffffff;
}
.documentviewerviewer canvas {
  background: #c2c2c2;
}
.documentviewerviewer embed {
  height: 600px;
  width: 100%;
}
.documentviewerplanemail {
  background-color: #ffffff;
  min-height: 300px;
  padding: 5px;
}
.documentviewerplanemailbody {
  padding: 0px;
  margin: 0px;
}
.documentvieweremailframe {
  border: none;
  width: 100%;
  border-top: 1px solid #c2c2c2;
}
/*
    <h2 id='docl'>Document List</h2>
    <p>CSS File:<strong>component.document-list.less</strong></p>
    <p>The styling here relates to the document list widget.  Different icons are used to represent different doc types.</p>
    <div style='border: 1px solid #000000;padding:15px'>
      For Example

    <div class="civicadocumentlist">
<div data-bind="showbusy: ShowBusyEnabled" class="">
    <div data-bind="if: HasDocuments">
        <!-- ko if: ShowFilter --><!-- /ko -->
        <!-- ko ifnot: HasDisplayedDocuments() --><!-- /ko -->
        <div class="civica-doclist">
                <ul class="fa-ul" data-bind="foreach: CompleteDocument">
                    <li class="civica-doclistitem" data-bind="visible: Display">
                        <i data-bind="css: IconCSS" class="fa-li fa fa-file-text-o fa-2x"></i><a href="javascript:void(0)" data-bind="click: OpenDocument"><span data-bind="text: DisplayTitle">Council Tax Bill</span></a>
                        <div><span data-bind="text: DisplayDate">1 November 2013</span></div>
                    </li>
                </ul>
        </div>
    </div>
</div>
</div>
</div>
    <p><a href="#top">Back to top of page</a></p>
*/

.civicadocumentlist {
  margin-top: 8px;
}
.civica-doclisthead {
  border-bottom: 1px solid #c2c2c2;
  padding: 10px;
}
.civica-doclisthead span {
  margin-left: 15px;
}
.civica-doclist {
  margin: 0 15px;
}
.civica-doclist ul {
  list-style-type: none;
}
.civica-doclist li i {
  margin-top: 15px;
}
.civicadocumentlist input[type="text"].civica-doclisttextfilter {
  margin: 0px;
}
.civicadocumentlist input[type="text"].civica-doclisttextfilter::-ms-clear {
  display: none;
}
.civica-doclisttextfilter {
  width: 250px;
}
.civica-doclisttitlelabel,
.civica-doclisttitletext,
.civica-doclisttitlerow,
.civica-doclistdetaillabel,
.civica-doclistdetailtext,
.civica-doclistdetailrow {
  display: inline-block;
}
.civica-doclistdetaillabel {
  font-weight: 600;
  padding-right: 8px;
}
.civica-doclistdetailrow {
  padding-right: 15px;
}
.civica-doclistsort {
  margin-left: 15px;
}
@media (max-width: 598px) {
  .civica-doclistsort {
    margin-left: 0px;
    margin-top: 5px;
  }
}
/*
    <h2>Widgets</h2>
    <p>CSS File:<strong>component.widgets.less</strong></p>
    <p>This file contains CivicaTown Customisations of Civica Web Framework</p>  
    <p><a href="#top">Back to top of page</a></p>
*/

/* This file contains CivicaTown Customisations of Civica Web Framework  

    Please keep styling in this file minimal as CivicaTown should display as items are delivered.
*/

.civicamainheader {
  font-size: 26px;
}
/*.civicaAnswer {
    white-space: nowrap;
}*/

.civicaForm a[role="button"] {
  min-width: 125px;
}
.civicafilecancelbutton {
  line-height: 40px;
  height: 40px;
  display: inline-block;
  box-sizing: border-box;
  padding: 0 10px;
  color: #ffffff;
}
.civicafilecancelbutton:hover {
  background: #F2F2F1;
  color: #3a3a3a;
}
.ui-widget-content {
  border: 1px solid #ddd;
  background: #f4f4f4;
  margin-bottom: 10px;
}
a.civicafileuploadbutton,
a.civicafileuploadanchor,
a.downloadButton,
a.civicasignatureanchor {
  box-sizing: border-box;
  line-height: 40px;
  height: 40px;
  display: inline-block;
  border: none;
  cursor: pointer;
  padding: 0 10px;
  border-radius: 0;
  margin-right: 1px;
  min-width: 150px;
  text-align: center;
}
.civicaformfields fieldset legend {
  /*display: none;*/
  position: absolute;
  clip: rect(0 0 0 0);
}
.btn-group-vertical .btn {
  margin-bottom: 10px;
  width: 200px;
}
.btn-group-vertical {
  margin-top: 10px;
}
.ui-accordion {
  padding-top: 10px;
}
.civicabusy {
  padding-top: 0px !important;
}
.mydetailspage .civicakeyobjectviewer .civicamainheader {
  display: none;
}
.mydetailspage .civicaTellUs {
  margin-top: 10px;
}
.civicaMyProperty .civicasubheader {
  font-size: 16px;
}
.civicaMyProperty #neighbourhood {
  float: right;
  margin-right: 0px;
}
.myaccountpanel {
  background-color: #faf6f6;
  border: 1px solid #e8e8e7;
  padding: 10px;
  width: 230px;
  text-align: center;
  height: 120px;
  margin-bottom: 10px;
}
.civica-login,
.civica-authentication {
  padding-bottom: 8px;
}
.civicafulltextsearch input {
  width: 80%;
}
.civicaQuestion label {
  max-width: 80%;
}
img.CivicaFormHelp {
  display: none;
}
.civicaforminlinefield {
  float: left;
}
.civicaformfield.civicainputfield {
  clear: both;
}
.civicaformfield.civicainputfield.civicaforminlinefield {
  clear: none;
}
#NewMessageThread .new_message_textArea {
  margin-top: 2%;
}
.notification:before {
  content: "";
  display: none;
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}
.opened:before {
  display: block;
}
.opened .notification-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 20%;
}
.notification-dialog {
  background: #fefefe;
  border: #333333 solid 0px;
  border-radius: 5px;
  margin-left: -200px;
  position: fixed;
  left: 50%;
  top: -100%;
  z-index: 11;
  width: 360px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
}
.notification-body {
  padding: 20px;
}
.civica-UnreadThreadCounttext .ui-button {
  background-color: #05242E;
  color: white;
  box-sizing: border-boxss;
  line-height: 40px;
  min-height: 40px;
  display: inline-block;
  border: none;
  cursor: pointer;
  padding: 0 15px;
  margin-right: 5px;
  margin-top: 15px;
  text-align: center;
  width: auto;
  min-width: auto;
}
.civica-thumbnaillist {
  margin-top: 15px;
}
.civica-thumbnailitem {
  margin-bottom: 15px;
}
.civica-thumbnailrow {
  min-height: 125px;
  display: flex;
  flex-direction: row;
}
.civica-thumbnailtext {
  display: flex;
  flex-direction: column;
}
.civica-thumbnailtext label {
  margin-top: 0px;
}
.civica-thumbnailtext button {
  width: 140px;
}
.civica-thumbnailrow canvas {
  margin-right: 15px;
  max-height: 125px;
  min-height: 125px;
}
.qtip-content {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  line-height: normal;
}
.jqplot-point-label {
  color: white;
  font-size: 1.3em;
  line-height: 0.8em;
}
.jqplot-target {
  color: #000;
}
.ui-slider {
  background: #cccccc;
}
.ui-slider .ui-slider-handle {
  position: absolute;
  z-index: 2;
}
.ui-slider-handle {
  border-radius: 15% !important;
  background-color: #093e52 !important;
  height: 1.8em !important;
  width: 1em !important;
  top: 0 !important;
  border: 0 !important;
  margin-left: -0.35em !important;
}
.ui-slider-handle:hover {
  border: 0 !important;
}
.ui-slider-horizontal {
  height: 1.7em;
  border-left: 0px;
  border-right: 0px;
  background: #ffffff;
}
.label {
  width: 41%;
  display: inline-block;
}
.label-pre {
  width: 41%;
  display: inline-block;
  text-align: right;
}
.label-post {
  width: 41%;
  display: inline-block;
  text-align: left;
}
.labelspacer {
  width: 76%;
  display: inline-block;
}
.outputlabel {
  width: 80%;
  display: inline-block;
  text-align: left;
}
.outputvalue {
  width: 18%;
  display: inline-block;
  text-align: right;
}
.slider {
  width: 80%;
  display: inline-block;
  border-radius: 0;
  background-color: #fff;
}
.roundedinput {
  text-align: left;
  width: 3.2em;
  height: 3.2em;
  min-width: 0px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  color: white;
  margin: 10px 0;
  padding: 0;
}
.inputbox {
  width: 10%;
  display: inline-block;
}
.inputbox input {
  text-align: left;
  width: 3.2em;
  height: 3.2em;
  min-width: 0px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  color: #ffffff;
  margin: 10px 0;
  padding: 0;
  min-width: 33%;
  padding: 0px;
  width: auto;
  margin: 0px;
  height: auto;
  background-size: 2em;
  border: 1px solid black;
  background-image: none;
  color: black;
  width: 2em;
  height: 2em;
  border-radius: 15%;
  margin-left: -6px;
}
.recalculateBtn {
  border-radius: 5px;
  margin-bottom: 1%;
}
.rotate90 {
  width: 250px;
  padding-left: 1.2em;
  text-align: left;
  -ms-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.modellerfont {
  font-size: 12px;
}
.upmRetirementModelChartSection {
  border-left: gray solid;
  border-bottom: gray solid;
  margin: 0px 10px 0px 0px;
}
.upmRetirementModelChartSection:after {
  content: "";
  display: table;
  clear: both;
}
.chart {
  height: 150px;
  width: 33.33%;
  float: left;
  padding: 0px 50px 0px 50px;
  position: relative;
}
.chart .valbar {
  width: 100%;
}
.chart #TargetIncomeBar {
  background-color: #093e52;
}
.chart #AnnualIncomeBar {
  background-color: #093e52;
}
.chart #LumpSumBar {
  background-color: #093e52;
}
.chart .maxbar {
  background-color: rbga(0, 0, 0, 0);
  width: 100%;
}
.upmChartLabel {
  padding: 1%;
  text-align: center;
  font-size: 10px;
}
.modellerChartMobile {
  display: none;
}
.pensionInformationContainer #pensionValues {
  padding: 0px 0px 10px 0px;
}
.pensionInformationHeader {
  font-weight: bold;
  padding: 0px 5px 5px 0px;
}
.modellerTable {
  padding: 2px 5px 2px 0px;
}
#govValues th {
  font-size: 14px;
  padding: 5px 0px 5px 0px;
}
hr {
  color: lightgray;
  background-color: lightgray;
}
.modellerInputs {
  width: 33%;
  float: left;
  font-weight: bold;
}
.modellerInputsSection:after {
  content: "";
  display: table;
  clear: both;
}
.modellerInputsSectionMobile {
  display: none;
}
.modellerChartLabelMobile {
  display: none;
  font-weight: bold;
}
.modellerInputLabel {
  margin-top: unset;
}
.numeric {
  min-width: 75px;
  max-width: 250px;
  min-height: auto;
  font-size: 12px;
}
.roundedinput {
  min-width: 33%;
  padding: 0px;
  width: auto;
  margin: 0px;
  height: auto;
}
.govInfo {
  padding: 5px 0px 5px 0px;
}
@media only screen and (max-width: 767px) {
  .modellerInputsSection div:last-of-type {
    margin: 15px;
  }
  .modellerInputs {
    float: none;
    display: block;
    width: auto;
    text-align: center;
    margin-bottom: 30px;
  }
  .roundedinput {
    width: auto;
    text-align: center;
  }
  .numeric {
    text-align: center;
  }
  .modellerChart {
    position: absolute;
    top: -1000px;
    left: -1100px;
    height: 300px;
    width: 1100px;
  }
  .upmChartLabel {
    width: 99%;
  }
  .modellerChartMobile {
    display: block;
  }
  .modellerChartLabelMobile {
    display: inline-block;
    font-weight: bold;
    font-size: 22px;
    width: 100%;
    text-align: center;
  }
  #govValues th {
    font-size: 14px;
    padding: 5px 0px 5px 0px;
  }
}
.ui-widget-content {
  border: 1px solid #ddd;
  background: #eee url(../../images/ui-bg_highlight-soft_100_eeeeee_1x100.png) 50% top repeat-x;
  margin-bottom: 10px;
}
.civica-loading {
  min-height: 100px;
  min-width: 100px;
}
.SecureMessageThread td {
  vertical-align: middle;
}
h3,
.civicasubheader {
  padding: 15px 0 5px 5px;
}
.civicaprocactiondetail .civicaForm {
  padding-left: 5px;
}
.civicaPersonLinks {
  margin: 0 5px;
}
.civicaFolderLinks {
  margin: 0 5px;
}
.ui-accordion .ui-accordion-header {
  border: 1px solid #ccc;
  background: #f6f6f6 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAGQEAAAAAAao4lEAAAAAmJLR0T//xSrMc0AAAAJcEhZcwAAAEgAAABIAEbJaz4AAABISURBVDjLY/g1mWEUjSKqo2/fGL5LMXzPYfh+nOGHFsOPBQw/xRh+TmX4JcLwq4vhNwPD71yG3xcZ/igx/Ilk+JM0ikYRMQgA8pJH3iOhTlAAAAAldEVYdGRhdGU6Y3JlYXRlADIwMTUtMDItMTVUMDc6MzU6MDIrMDA6MDAtnAKfAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDE1LTAyLTE1VDA3OjM1OjAyKzAwOjAwXMG6IwAAAABJRU5ErkJggg==) 50% 50% repeat-x;
  font-weight: bold;
  color: #1c5571;
}
.ui-accordion .ui-accordion-header {
  display: block;
  cursor: pointer;
  position: relative;
  margin: 2px 0 0 0;
  padding: 0.5em 0.5em 0.5em 0.7em;
  min-height: 0;
  font-size: 100%;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  position: absolute;
  left: 0.5em;
  top: 50%;
  margin-top: -8px;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  border: 1px solid #fbd850;
  background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAGQAQAAAABHIzd2AAAAAmJLR…VYdGRhdGU6bW9kaWZ5ADIwMTUtMDItMTVUMDc6MzU6MDIrMDA6MDBcwbojAAAAAElFTkSuQmCC) 50% 50% repeat-x;
  font-weight: bold;
  color: #eb8f00;
}
.ui-accordion .ui-accordion-header {
  display: block;
  cursor: pointer;
  position: relative;
  margin: 2px 0 0 0;
  padding: 0.5em 0.5em 0.5em 0.7em;
  min-height: 0;
  font-size: 100%;
}
.ui-accordion .ui-accordion-icons {
  padding-left: 2.2em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
  padding-left: 2.2em;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  position: absolute;
  left: 0.5em;
  top: 50%;
  margin-top: -8px;
}
.ui-accordion .ui-accordion-content {
  padding: 1em 2.2em;
  border-top: 0;
  overflow: auto;
}
.ui-icon {
  width: 16px;
  height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
  background-image: url(data:image/png;base64,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);
}
.ui-widget-header .ui-icon {
  background-image: url(data:image/png;base64,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);
}
.ui-state-default .ui-icon {
  background-image: url(data:image/png;base64,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);
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
  background-image: url(data:image/png;base64,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);
}
.ui-state-active .ui-icon {
  background-image: url(data:image/png;base64,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);
}
.ui-state-highlight .ui-icon {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAADwCAMAAADYSUr5AAABDlBMVEUijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEijvEzfqCuAAAAWXRSTlMAGRAzBAhQv4KZLyJVcUBmYBoTMswNITwWQkhLIB5aIycxUyyFNIeAw2rIz8Y4RRy8uL58q7WljKqorR+yKf0BnlEk7woGAgOPomKUSqCvbd+cR2M/b3+RaPlAXvEAAAABYktHRACIBR1IAAAACXBIWXMAAABIAAAASABGyWs+AAAPZElEQVR42u1dC2PbthEGyUiq6ZiSXblLE6ex1mTO5iXZq+u6ro3abG26pOkSd13v//+RAXzhcIeHWMoUbeOTLesIEMB9PIB3ACgLERERMQIkkOy6CTvWH0bOQO/mJeDXP8EMqMzDEkIsEBRMAmh7jHSVmuAjAKwC8FRAzi8/DmoS1AI5AQltj5FOryAjgJ7OK2CZkwEZYO23q+BJ5wwKkttfui1z4s20VTAL5k2kF5hbiPcKcwvwNGB4C7CTwproI4CdDcxEPKUTExx+DNiAj0u9C9AuNPxdYOe46Y5QRERERERExIhx6Z7gjv2ghEVrQJ33hJ5BsxsBfsIq8M0HsAkhWfqglFgawAhgGWh2M1xMWAWUAE90qUofMhhi7be32JNsmVFJPKeLwBQglAQMNh3ALVjYbNaI1jaYD0jM0nw9atcWYEXiaXH/+QDeQ3Y6BoRx3e8CERERERERERG7Qz/HP+iaBsvvHXj0LAD4cip0yN27fXw7AGtQoDTwH+HqkWTgWczTwZVmr8DbAEuqv35bCT6CWDorjGnAqwOSCI7EhlFWHjkBXIkb1M/DZQgRwCeAwK9B+HRPFlPBOjeZ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);
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
  background-image: url(data:image/png;base64,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);
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
  text-decoration: none;
}
.ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
}
.ui-icon-triangle-1-n {
  background-position: 0 -16px;
}
.ui-icon-triangle-1-ne {
  background-position: -16px -16px;
}
.ui-icon-triangle-1-e {
  background-position: -32px -16px;
}
.ui-icon-triangle-1-se {
  background-position: -48px -16px;
}
.ui-icon-triangle-1-s {
  background-position: -64px -16px;
}
.ui-icon-triangle-1-sw {
  background-position: -80px -16px;
}
.ui-icon-triangle-1-w {
  background-position: -96px -16px;
}
.ui-icon-triangle-1-nw {
  background-position: -112px -16px;
}
.ui-icon-triangle-2-n-s {
  background-position: -128px -16px;
}
.ui-icon-triangle-2-e-w {
  background-position: -144px -16px;
}
.ui-icon-mail-closed {
  background-position: -80px -96px;
}
.ui-icon-mail-open {
  background-position: -96px -96px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
  border-top-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
  border-top-right-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
  border-bottom-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
  border-bottom-right-radius: 4px;
}
.qtip-icon .ui-icon {
  overflow: visible;
}
.ui-datepicker {
  border: 1px solid #ddd;
  background-color: #fff;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
  border: 1px solid #cd0a0a;
  background: #b81900 url(/civica/content/external/jqueryui/images/ui-bg_diagonals-thick_18_b81900_40x40.png) 50% 50% repeat;
  color: #ffffff;
}
.documentviewerpdf embed {
  width: 100%;
  height: 600px;
}
.civicaPersonDetails td {
  width: 50%;
}
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  width: auto;
}
#divDynamicHome {
  position: absolute;
  left: 0;
  right: 0;
  width: 30%;
  bottom: 23%;
  padding: 0px;
  background: rgba(20, 20, 20, 0.8);
  text-align: center;
  margin: 0 auto;
  /*margin-top:1%;*/

}
#divDynamicHome table td {
  width: auto;
}
.dynamicHomepageTitle {
  font-weight: normal;
  font-weight: 600;
}
#divCivicaContent {
  left: 0;
  right: 0;
  background: rgba(20, 20, 20, 0.8);
  text-align: center;
  margin: 0 auto;
  padding: 10px 0px;
}
#keyobjectlist {
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: left;
}
#divDynamicHome .spanContent {
  float: left;
  max-width: 40%;
  text-align: left;
  color: #093e52;
}
#notificationlist {
  display: none;
  background: #ffffff;
  height: 150px;
  bottom: 2%;
  font-weight: normal;
  font-weight: 600;
  height: auto;
}
#keyobjectlist .civicakeyobjectlist-upmgeneric {
  overflow: auto;
}
#divDynamicHome .civicaFolderHeader {
  padding-left: 30px;
}
#divDynamicHome .civicaFolderBody {
  padding: 0px;
}
#notificationlist .SecureMessageThread {
  border: 0px;
  border-bottom: 1px solid #3a3a3a;
  border-radius: 0px;
  margin-top: 5px;
  color: #3a3a3a;
}
#divCivicaContent {
  padding: 10px 0;
}
#divDynamicHome .ui-accordion .ui-accordion-header {
  padding-left: 30px;
}
#notificationlist {
  height: auto;
}
#divDynamicHome .wrap {
  overflow-y: auto;
  max-height: 500px;
  background: rgba(20, 20, 20, 0.8);
}
.home-hero > div#divDynamicHome {
  top: 80px;
  bottom: 0;
}
#notificationlist .firstMessageBody {
  float: left;
}
#notificationlist .subjectrow {
  display: inline-block;
  width: 100%;
}
#notificationlist .subjectrow div {
  float: right;
}
#notificationlist a.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only {
  display: block;
}
#divDynamicHome table td {
  padding-left: 15px;
}
#divDynamicHome div#SecureMessageThreadList {
  padding-left: 15px;
}
#divDynamicHome img.busyimg {
  width: 35px;
}
#divDynamicHome .ellipsis {
  float: right;
  font-weight: bold;
  color: #1c5571;
  text-decoration: none;
}
#divDynamicHome .ellipsis:hover {
  text-decoration: none;
}
#keyobjectlist .civicaFolderDetails td {
  max-width: 170px;
}
@media (max-width: 767px) {
  #divDynamicHome {
    width: 100%;
    top: 0px;
    padding: 1px 1px;
    position: relative;
  }
  #divDynamicHome .wrap {
    max-height: 422px;
  }
  .home-hero img {
    display: none;
  }
}
@media (min-width: 768px) {
  #divDynamicHome {
    min-width: 480px;
    margin-top: 10px;
    max-height: 50px;
  }
  .homeImage {
    min-height: 550px;
  }
  #divDynamicHome .wrap {
    max-height: 410px;
  }
}
@media (min-width: 992px) {
  #divDynamicHome {
    max-height: 50px;
  }
}
@media (min-width: 1200px) {
  #divDynamicHome {
    max-height: 50px;
  }
}
/*
 
    <h2>Dc Investment</h2>
    <p>CSS File: <strong>component.dcinvestment.less</strong></p>
    <p>This file contains the styling for the process action Display DC Investment.</p>
    <p><a href="#top">Back to top of page</a></p>
*/

.fund-type-pie1 {
  background-color: #093e52;
}
.fund-type-pie2 {
  background-color: #b62b60;
}
.fund-type-pie3 {
  background-color: #f1614e;
}
.fund-type-pie4 {
  background-color: #fbb040;
}
.fund-type-pie5 {
  background-color: #8ccfb7;
}
.Investment-return-line1 {
  background-color: #093e52;
}
div.dcInvestmentTable td {
  font-size: 14px;
  /*margin-left: 15px;
        padding: 0 15px 15px 15px;*/

}
a.paginate_button {
  padding-right: 4px;
}
a.paginate_button.current {
  text-decoration: underline;
}
.dcInvestmentTable th,
.dcInvestmentTable td,
#TotalsByFundTable table th,
#TotalsByFundTable table td {
  border: 1px solid #000;
}
div.dcInvestmentTable tfoot > tr > td {
  border: none;
  font-size: 18px;
}
div.InvestmentReturn td,
div.TotalsByFundTypeData td {
  font-size: 14px;
}
@media (max-width: 767px) {
  div.InvestmentReturn,
  div.TotalsByFundTypeData {
    /*margin-right: 15px;*/
    width: 100%;
    display: inline-block;
  }
  /*hide all columns apart from total value and fund name*/
  
  div.dcInvestmentTable th:nth-child(2),
  div.dcInvestmentTable th:nth-child(3),
  div.dcInvestmentTable th:nth-child(4),
  div.dcInvestmentTable th:nth-child(5),
  div.dcInvestmentTable th:nth-child(6),
  div.dcInvestmentTable td:nth-child(2),
  div.dcInvestmentTable td:nth-child(3),
  div.dcInvestmentTable td:nth-child(4),
  div.dcInvestmentTable td:nth-child(5),
  div.dcInvestmentTable td:nth-child(6),
  div.TotalsByFundTypeData,
  div.InvestmentReturn {
    display: none;
  }
  /*reposition invalid date message*/
  
  div.qtip.qtip-default.qtip-red.qtip-pos-bl {
    width: 123px;
  }
}
@media (min-width: 768px) {
  div.dcInvestmentTable {
    width: 100%;
    display: inline-block;
    padding-right: 10px;
  }
  div.InvestmentReturn,
  div.TotalsByFundTypeData {
    width: calc(50%);
    display: block;
    margin-left: auto;
    margin-right: auto;
    /*margin-left: 10px;
          padding: 0 30px 15px 30px;
              margin-top: 15px;
              margin-left: 30px;*/
  
  }
}
@media (min-width: 992px) {
  
}
@media (min-width: 1500px) {
  div.dcInvestmentTable {
    display: inline-block;
    vertical-align: top;
    width: 77%;
  }
  div.InvestmentReturn,
  div.TotalsByFundTypeData {
    display: inline-block;
    width: calc(23%);
    padding-left: 45px;
  }
}
.civicafieldset {
  font-size: 16px;
}
.civicasubheader {
  padding: 5px 0 5px 5px;
  font-size: 16px;
  margin: unset;
}
h2,
.civicamainheader {
  font-size: 22px;
  margin-top: 10px;
  margin: 10px 0 10px 0;
}
h4 {
  margin-top: unset;
  margin-bottom: 10px;
  font-size: 18px;
}
.dataTables_info,
.dataTables_paginate {
  font-size: 16px;
}
div.buttoncontainer {
  margin-left: 0px;
}
.civicabtn,
button,
.btn {
  font-size: 16px;
  margin-top: 10px;
}
.civicabtn:hover,
button:hover,
.btn:hover,
.civicabtn:focus,
button:focus,
.btn:focus,
.civicabtn.focus,
button.focus,
.btn.focus {
  text-decoration: none;
}
.civicabtn:active,
button:active,
.btn:active,
.civicabtn.active,
button.active,
.btn.active {
  outline: 0;
  background-image: none;
}
.civicabtn.disabled,
button.disabled,
.btn.disabled,
.civicabtn[disabled],
button[disabled],
.btn[disabled],
fieldset[disabled] .civicabtn,
fieldset[disabled] button,
fieldset[disabled] .btn {
  pointer-events: none;
}
.dcInvestmentTablePrev .civicadatepicker {
  margin-bottom: 10px;
}
/*
 
    <h2>Dc Lifestyle Matrix</h2>
    <p>CSS File: <strong>component.dcinvestment.less</strong></p>
    <p>This file contains the styling for the process action Display DC Investment.</p>
    <p><a href="#top">Back to top of page</a></p>
*/

.dc-matrix-equities {
  background-color: #093e52;
}
.dc-matrix-balanced {
  background-color: #b62b60;
}
.dc-matrix-gilts {
  background-color: #f1614e;
}
.dc-matrix-cash {
  background-color: #fbb040;
}
/*
 
    <h2>Dc Modeller chart</h2>
    <p>CSS File: <strong>component.DCModeller.less</strong></p>
    <p>This file contains the styling for the process action Display DC Modeller.</p>
    <p><a href="#top">Back to top of page</a></p>
*/

.dc-modeller-target {
  background-color: #093e52;
}
.dc-modeller-state {
  background-color: #b62b60;
}
.dc-modeller-pension {
  background-color: #f1614e;
}
.dc-modeller-cash {
  background-color: #fbb040;
}
.civicaprocrunact.action-DCIModeller .civicaformfields fieldset legend {
  font-weight: 500;
  font-size: 20px;
  font-family: "Ubuntu", sans-serif;
  position: relative;
  max-width: 100%;
  white-space: normal;
}
.civicaprocrunact.action-DCIModeller fieldset {
  border: 1px solid #6c6c6c;
}
.civicaprocrunact.action-DCIModeller label {
  font-size: 16px;
  margin-top: 0px;
  font-weight: 300;
  display: block;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer input {
  font-size: 16px;
  min-height: 0px;
  min-width: 0px;
  width: 100%;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer input[type=radio] {
  width: 30px;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer select {
  font-size: 16px;
  min-height: 0px;
  min-width: 0px;
  width: 100%;
}
.civicaprocrunact.action-DCIModeller .civicaQuestion a {
  vertical-align: top;
}
.civicaprocrunact.action-DCIModeller h2 {
  font-size: 18px;
}
.civicaprocrunact.action-DCIModeller .civicaQuestion {
  width: 75%;
  display: inline-block;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer {
  width: 25%;
  display: inline-block;
  vertical-align: top;
}
.civicaprocrunact.action-DCIModeller .civicaQuestion.radio,
.civicaprocrunact.action-DCIModeller .civicaQuestion.Range {
  width: 100%;
  display: inline-block;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer.radio,
.civicaprocrunact.action-DCIModeller .civicaAnswer.Range {
  width: 100%;
  display: inline-block;
  vertical-align: top;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer.Range input[type=Range] {
  width: calc(100% - 90px);
  display: inline-block;
  vertical-align: middle;
  padding: 0px;
}
.civicaprocrunact.action-DCIModeller .civicaAnswer.Range input[type=Number] {
  width: 25%;
  display: inline-block;
  vertical-align: top;
}
.civicaprocrunact.action-DCIModeller .civicaForm > .civicaformfields {
  display: flex;
  flex-direction: column;
  height: auto;
}
@media (min-width: 768px) {
  .civicaprocrunact.action-DCIModeller .civicaForm > .civicaformfields {
    display: block;
    columns: 2;
  }
  .civicaprocrunact.action-DCIModeller .civicaformfields div {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }
  .civicaprocrunact.action-DCIModeller .civicaQuestion > label {
    display: inline-block;
  }
}
.DCModeller .civicabusy {
  background-color: rgba(0, 0, 0, 0.2);
}
.civicaprocrunact.action-DCIModeller input[type=radio] + label,
.civicaprocrunact.action-DCIModeller input[type=CheckBox] + label {
  display: inline;
}
#gbg-root div.ensure {
  background-color: #1c5571;
  border-radius: 2px;
  display: inline-block;
}
#gbg-root div.ensure li:before {
  color: #f6c21d;
  font-family: "FontAwesome";
  content: '\f054';
  top: 8px;
  position: absolute;
}
#gbg-root div.ensure li span::before {
  content: '';
  font-family: "FontAwesome";
  color: #f6c21d;
  padding-right: 30px;
  font-size: 16px;
  display: table-cell;
}
#gbg-root .ensure h2 {
  color: #ffffff;
}
#gbg-root .ensure li {
  color: #ffffff;
  display: table;
}
#gbg-root .ensure li {
  position: relative;
}
#gbg-root .image-preview,
#gbg-root .camera-viewfinder,
#gbg-root .cropper {
  display: block;
  margin: 8px auto;
  width: 100%;
  max-height: 70vh;
  object-fit: contain;
}
#gbg-root .button-container {
  display: flex;
  align-items: stretch;
  margin: 8px auto;
  width: 100%;
}
#gbg-root .file-input--container {
  display: none;
}
#gbg-root .file-input--alternatives {
  display: block;
  cursor: pointer;
  width: 100%;
  padding: 20px;
  line-height: 44px;
  border: 2px dotted silver;
  text-align: center;
}
#gbg-root .file-input--alternatives.dragover {
  border-color: black;
}
#gbg-root .camera-condition {
  display: inline-block;
  padding: 5px;
  border-radius: 4px;
  background: #FFFFA3;
  color: #3a3a3a;
}
#gbg-root .camera-message--container {
  text-align: center;
  padding: 5px;
  margin-top: 8px;
  border: 1px solid #F1D031;
  background-color: #FFFFA3;
}
#gbg-root .document {
  border: 1px solid silver;
  padding: 5px;
  border-radius: 4px;
  margin-bottom: 10px;
}
#gbg-root .info-item {
  margin: 5px 0;
}
#gbg-root .info-item__name {
  font-weight: bold;
}
#gbg-root .info-item__name:after {
  content: ':';
}
#gbg-root .document__details {
  border-bottom: 1px solid silver;
}
/* 
 Theme-specific styles split up by pages 
 */

/*
    <h2 id='myacc'>MyAccount Page</h2>
    <p>CSS File: <strong>theme.myaccounts.less</strong></p>
    <p>This file contains the styling for the My Accounts page.</p>
    <p><a href="#top">Back to top of page</a></p>

*/

@media (min-width: 992px) {
  .civica-myaccounts-homepage {
    background: url("/media/Accounts/home.jpg") no-repeat;
    background-size: cover;
  }
}
/*
    <h2 id='home'>Home Page Styling</h2>
    <p>CSS File: <strong>theme.home.less</strong></p>
    <p>This file contains the styling for the home page.</p>
    <p><a href="#top">Back to top of page</a></p>
*/

.home-hero {
  position: relative;
  width: 100%;
  color: #ffffff;
}
.home-hero img {
  width: 100%;
}
.home-hero > div {
  position: absolute;
  left: 0;
  right: 0;
  width: 40%;
  bottom: 25%;
  background: rgba(20, 20, 20, 0.8);
  text-align: center;
  margin: 0 auto;
  padding: 15px 30px;
}
.home-hero h1 {
  color: #ffffff;
  font-size: 40px;
  font-size: 3vw;
}
.home-hero nav {
  position: absolute;
  background-color: rgba(30, 30, 30, 0.8);
  top: 0px;
  z-index: 1;
  width: 100%;
}
.home-hero nav a,
.home-hero nav a:visited {
  color: #ffffff;
}
.home-hero nav a:hover,
.home-hero nav a:focus {
  cursor: pointer;
  text-decoration: none;
  background-color: rgba(10, 10, 10, 0.48);
  transition: background-color 500ms linear;
}
@media screen and (min-width: 768px) {
  .home-hero nav a {
    float: left;
    display: inline-block;
    width: 25%;
    text-align: center;
    padding: 15px;
    cursor: pointer;
    font-size: 36px;
    font-size: 2.6vw;
    font-family: "Ubuntu", sans-serif;
    margin: 0;
  }
}
@media screen and (min-width: 1100px) {
  .home-hero nav a {
    font-size: 36px;
  }
}
@media screen and (max-width: 767px) {
  .home-hero nav {
    position: relative;
    background-color: #072438;
    text-align: center;
  }
  .home-hero nav a {
    padding: 10px 15px;
    position: relative;
    display: block;
    margin-bottom: 8px;
  }
  .home-hero img {
    display: none;
  }
}
/*
    <h2 id='login'>Login Page</h2>
    <p>CSS File: <strong>theme.login.less</strong></p>
    <p>This file contains the styling needed for the login page.</p>
    <p><a href="#top">Back to top of page</a></p>

*/

.login-form {
  max-width: 450px;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
}
.login-form input,
.login-form input[type="password"],
.login-form input[type="text"] {
  width: 100%;
  display: block;
}
.login-form > div:first-child {
  min-height: 230px;
}
.civica-login > a {
  white-space: nowrap;
}
.login-form > h1.headerLine {
  line-height: 40px;
  text-rendering: optimizelegibility;
  display: block;
  text-align: center;
  color: #000;
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 20px;
}
.login-form fieldset {
  border: none;
  margin: 0;
  padding: 0;
}
.login-form legend {
  padding-left: 0;
  display: none;
}
input[name="txtOneTimeCode"] {
  -webkit-text-security: disc;
}
/* 
 Trumps are overrides, helpers, utilities. They should only affect 
 one piece of DOM at a time and usually carry !important 
 */

/*
    <h2>Responsive</h2>
    <p>CSS File: <strong>trumps.responsive.less</strong></p>
    <p>These styles are overrides for responsive functionality.</p>  
    <p><a href="#top">Back to top of page</a></p>

*/

@media (max-width: 767px) {
  header > .hidden-small-only {
    display: none !important;
  }
  .hidden-small-only img {
    display: none !important;
  }
  div.qtip.qtip-default.qtip-red.qtip-pos-bl {
    left: 60% !important;
  }
}
@media (min-width: 768px) {
  .hidden-medium-upwards {
    display: none !important;
  }
}
.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 768px) {
  .container {
    width: 753px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 962px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}
/*

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: @default-spacing;
    padding-right: @default-spacing;
}

@media (min-width:768px) {
    .container {
        width: 750px;
    }
    
}

@media (min-width:992px) {
    .container {
        width: 970px;
    }
     
}

@media (min-width:1200px) {
    .container {
        width: 1170px;
    }
      

}

.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: @default-spacing;
    padding-right: @default-spacing;
}

.row {
    margin-left: -@default-spacing;
    margin-right: -@default-spacing;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-left: @default-spacing;
    padding-right: @default-spacing;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
    float: left;
}

.col-xs-12 {
    width: 100%;
}

.col-xs-11 {
    width: 91.66666667%;
}

.col-xs-10 {
    width: 83.33333333%;
}

.col-xs-9 {
    width: 75%;
}

.col-xs-8 {
    width: 66.66666667%;
}

.col-xs-7 {
    width: 58.33333333%;
}

.col-xs-6 {
    width: 50%;
}

.col-xs-5 {
    width: 41.66666667%;
}

.col-xs-4 {
    width: 33.33333333%;
}

.col-xs-3 {
    width: 25%;
}

.col-xs-2 {
    width: 16.66666667%;
}

.col-xs-1 {
    width: 8.33333333%;
}

.col-xs-pull-12 {
    right: 100%;
}

.col-xs-pull-11 {
    right: 91.66666667%;
}

.col-xs-pull-10 {
    right: 83.33333333%;
}

.col-xs-pull-9 {
    right: 75%;
}

.col-xs-pull-8 {
    right: 66.66666667%;
}

.col-xs-pull-7 {
    right: 58.33333333%;
}

.col-xs-pull-6 {
    right: 50%;
}

.col-xs-pull-5 {
    right: 41.66666667%;
}

.col-xs-pull-4 {
    right: 33.33333333%;
}

.col-xs-pull-3 {
    right: 25%;
}

.col-xs-pull-2 {
    right: 16.66666667%;
}

.col-xs-pull-1 {
    right: 8.33333333%;
}

.col-xs-pull-0 {
    right: 0;
}

.col-xs-push-12 {
    left: 100%;
}

.col-xs-push-11 {
    left: 91.66666667%;
}

.col-xs-push-10 {
    left: 83.33333333%;
}

.col-xs-push-9 {
    left: 75%;
}

.col-xs-push-8 {
    left: 66.66666667%;
}

.col-xs-push-7 {
    left: 58.33333333%;
}

.col-xs-push-6 {
    left: 50%;
}

.col-xs-push-5 {
    left: 41.66666667%;
}

.col-xs-push-4 {
    left: 33.33333333%;
}

.col-xs-push-3 {
    left: 25%;
}

.col-xs-push-2 {
    left: 16.66666667%;
}

.col-xs-push-1 {
    left: 8.33333333%;
}

.col-xs-push-0 {
    left: 0;
}

.col-xs-offset-12 {
    margin-left: 100%;
}

.col-xs-offset-11 {
    margin-left: 91.66666667%;
}

.col-xs-offset-10 {
    margin-left: 83.33333333%;
}

.col-xs-offset-9 {
    margin-left: 75%;
}

.col-xs-offset-8 {
    margin-left: 66.66666667%;
}

.col-xs-offset-7 {
    margin-left: 58.33333333%;
}

.col-xs-offset-6 {
    margin-left: 50%;
}

.col-xs-offset-5 {
    margin-left: 41.66666667%;
}

.col-xs-offset-4 {
    margin-left: 33.33333333%;
}

.col-xs-offset-3 {
    margin-left: 25%;
}

.col-xs-offset-2 {
    margin-left: 16.66666667%;
}

.col-xs-offset-1 {
    margin-left: 8.33333333%;
}

.col-xs-offset-0 {
    margin-left: 0;
}

@media (min-width:768px) {
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
        float: left;
    }

    .col-sm-12 {
        width: 100%;
    }

    .col-sm-11 {
        width: 91.66666667%;
    }

    .col-sm-10 {
        width: 83.33333333%;
    }

    .col-sm-9 {
        width: 75%;
    }

    .col-sm-8 {
        width: 66.66666667%;
    }

    .col-sm-7 {
        width: 58.33333333%;
    }

    .col-sm-6 {
        width: 50%;
    }

    .col-sm-5 {
        width: 41.66666667%;
    }

    .col-sm-4 {
        width: 33.33333333%;
    }

    .col-sm-3 {
        width: 25%;
    }

    .col-sm-2 {
        width: 16.66666667%;
    }

    .col-sm-1 {
        width: 8.33333333%;
    }

    .col-sm-pull-12 {
        right: 100%;
    }

    .col-sm-pull-11 {
        right: 91.66666667%;
    }

    .col-sm-pull-10 {
        right: 83.33333333%;
    }

    .col-sm-pull-9 {
        right: 75%;
    }

    .col-sm-pull-8 {
        right: 66.66666667%;
    }

    .col-sm-pull-7 {
        right: 58.33333333%;
    }

    .col-sm-pull-6 {
        right: 50%;
    }

    .col-sm-pull-5 {
        right: 41.66666667%;
    }

    .col-sm-pull-4 {
        right: 33.33333333%;
    }

    .col-sm-pull-3 {
        right: 25%;
    }

    .col-sm-pull-2 {
        right: 16.66666667%;
    }

    .col-sm-pull-1 {
        right: 8.33333333%;
    }

    .col-sm-pull-0 {
        right: 0;
    }

    .col-sm-push-12 {
        left: 100%;
    }

    .col-sm-push-11 {
        left: 91.66666667%;
    }

    .col-sm-push-10 {
        left: 83.33333333%;
    }

    .col-sm-push-9 {
        left: 75%;
    }

    .col-sm-push-8 {
        left: 66.66666667%;
    }

    .col-sm-push-7 {
        left: 58.33333333%;
    }

    .col-sm-push-6 {
        left: 50%;
    }

    .col-sm-push-5 {
        left: 41.66666667%;
    }

    .col-sm-push-4 {
        left: 33.33333333%;
    }

    .col-sm-push-3 {
        left: 25%;
    }

    .col-sm-push-2 {
        left: 16.66666667%;
    }

    .col-sm-push-1 {
        left: 8.33333333%;
    }

    .col-sm-push-0 {
        left: 0;
    }

    .col-sm-offset-12 {
        margin-left: 100%;
    }

    .col-sm-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-sm-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-sm-offset-9 {
        margin-left: 75%;
    }

    .col-sm-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-sm-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-sm-offset-6 {
        margin-left: 50%;
    }

    .col-sm-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-sm-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-sm-offset-3 {
        margin-left: 25%;
    }

    .col-sm-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-sm-offset-1 {
        margin-left: 8.33333333%;
    }

    .col-sm-offset-0 {
        margin-left: 0;
    }
}

@media (min-width:992px) {
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: left;
    }

    .col-md-12 {
        width: 100%;
    }

    .col-md-11 {
        width: 91.66666667%;
    }

    .col-md-10 {
        width: 83.33333333%;
    }

    .col-md-9 {
        width: 75%;
    }

    .col-md-8 {
        width: 66.66666667%;
    }

    .col-md-7 {
        width: 58.33333333%;
    }

    .col-md-6 {
        width: 50%;
    }

    .col-md-5 {
        width: 41.66666667%;
    }

    .col-md-4 {
        width: 33.33333333%;
    }

    .col-md-3 {
        width: 25%;
    }

    .col-md-2 {
        width: 16.66666667%;
    }

    .col-md-1 {
        width: 8.33333333%;
    }

    .col-md-pull-12 {
        right: 100%;
    }

    .col-md-pull-11 {
        right: 91.66666667%;
    }

    .col-md-pull-10 {
        right: 83.33333333%;
    }

    .col-md-pull-9 {
        right: 75%;
    }

    .col-md-pull-8 {
        right: 66.66666667%;
    }

    .col-md-pull-7 {
        right: 58.33333333%;
    }

    .col-md-pull-6 {
        right: 50%;
    }

    .col-md-pull-5 {
        right: 41.66666667%;
    }

    .col-md-pull-4 {
        right: 33.33333333%;
    }

    .col-md-pull-3 {
        right: 25%;
    }

    .col-md-pull-2 {
        right: 16.66666667%;
    }

    .col-md-pull-1 {
        right: 8.33333333%;
    }

    .col-md-pull-0 {
        right: 0;
    }

    .col-md-push-12 {
        left: 100%;
    }

    .col-md-push-11 {
        left: 91.66666667%;
    }

    .col-md-push-10 {
        left: 83.33333333%;
    }

    .col-md-push-9 {
        left: 75%;
    }

    .col-md-push-8 {
        left: 66.66666667%;
    }

    .col-md-push-7 {
        left: 58.33333333%;
    }

    .col-md-push-6 {
        left: 50%;
    }

    .col-md-push-5 {
        left: 41.66666667%;
    }

    .col-md-push-4 {
        left: 33.33333333%;
    }

    .col-md-push-3 {
        left: 25%;
    }

    .col-md-push-2 {
        left: 16.66666667%;
    }

    .col-md-push-1 {
        left: 8.33333333%;
    }

    .col-md-push-0 {
        left: 0;
    }

    .col-md-offset-12 {
        margin-left: 100%;
    }

    .col-md-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-md-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-md-offset-9 {
        margin-left: 75%;
    }

    .col-md-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-md-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-md-offset-6 {
        margin-left: 50%;
    }

    .col-md-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-md-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-md-offset-3 {
        margin-left: 25%;
    }

    .col-md-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-md-offset-1 {
        margin-left: 8.33333333%;
    }

    .col-md-offset-0 {
        margin-left: 0;
    }
}

@media (min-width:1200px) {
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
        float: left;
    }

    .col-lg-12 {
        width: 100%;
    }

    .col-lg-11 {
        width: 91.66666667%;
    }

    .col-lg-10 {
        width: 83.33333333%;
    }

    .col-lg-9 {
        width: 75%;
    }

    .col-lg-8 {
        width: 66.66666667%;
    }

    .col-lg-7 {
        width: 58.33333333%;
    }

    .col-lg-6 {
        width: 50%;
    }

    .col-lg-5 {
        width: 41.66666667%;
    }

    .col-lg-4 {
        width: 33.33333333%;
    }

    .col-lg-3 {
        width: 25%;
    }

    .col-lg-2 {
        width: 16.66666667%;
    }

    .col-lg-1 {
        width: 8.33333333%;
    }

    .col-lg-pull-12 {
        right: 100%;
    }

    .col-lg-pull-11 {
        right: 91.66666667%;
    }

    .col-lg-pull-10 {
        right: 83.33333333%;
    }

    .col-lg-pull-9 {
        right: 75%;
    }

    .col-lg-pull-8 {
        right: 66.66666667%;
    }

    .col-lg-pull-7 {
        right: 58.33333333%;
    }

    .col-lg-pull-6 {
        right: 50%;
    }

    .col-lg-pull-5 {
        right: 41.66666667%;
    }

    .col-lg-pull-4 {
        right: 33.33333333%;
    }

    .col-lg-pull-3 {
        right: 25%;
    }

    .col-lg-pull-2 {
        right: 16.66666667%;
    }

    .col-lg-pull-1 {
        right: 8.33333333%;
    }

    .col-lg-pull-0 {
        right: 0;
    }

    .col-lg-push-12 {
        left: 100%;
    }

    .col-lg-push-11 {
        left: 91.66666667%;
    }

    .col-lg-push-10 {
        left: 83.33333333%;
    }

    .col-lg-push-9 {
        left: 75%;
    }

    .col-lg-push-8 {
        left: 66.66666667%;
    }

    .col-lg-push-7 {
        left: 58.33333333%;
    }

    .col-lg-push-6 {
        left: 50%;
    }

    .col-lg-push-5 {
        left: 41.66666667%;
    }

    .col-lg-push-4 {
        left: 33.33333333%;
    }

    .col-lg-push-3 {
        left: 25%;
    }

    .col-lg-push-2 {
        left: 16.66666667%;
    }

    .col-lg-push-1 {
        left: 8.33333333%;
    }

    .col-lg-push-0 {
        left: 0;
    }

    .col-lg-offset-12 {
        margin-left: 100%;
    }

    .col-lg-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-lg-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-lg-offset-9 {
        margin-left: 75%;
    }

    .col-lg-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-lg-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-lg-offset-6 {
        margin-left: 50%;
    }

    .col-lg-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-lg-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-lg-offset-3 {
        margin-left: 25%;
    }

    .col-lg-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-lg-offset-1 {
        margin-left: 8.33333333%;
    }

    .col-lg-offset-0 {
        margin-left: 0;
    }
}


.clearfix:before, .clearfix:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .modal-footer:before, .modal-footer:after {
    content: " ";
    display: table;
}

.clearfix:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .modal-footer:after {
    clear: both;
}


@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: block !important;
  }
  table.visible-print {
    display: table;
  }
  tr.visible-print {
    display: table-row !important;
  }
  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}
.visible-print-block {
  display: none !important;
}
@media print {
  .visible-print-block {
    display: block !important;
  }
}
.visible-print-inline {
  display: none !important;
}
@media print {
  .visible-print-inline {
    display: inline !important;
  }
}
.visible-print-inline-block {
  display: none !important;
}
@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}

    */

/*
    <h2>Authentication State</h2>
    <p>CSS File:<strong>trumps.authentication-state.less</strong></p>
    <p>You can use these styles to show / hide according to the logged in contacts authentication status.</p>
    <p>They are set in the masterpage after the authentication widget has run.</p>  
    <p><a href="#top">Back to top of page</a></p>

*/

.hidden-authenticated {
  display: block !important;
}
.hidden-anonymous {
  display: none !important;
}
.display-authlevel0,
.display-authlevel1,
.display-authlevel2,
.display-authlevel3,
.display-authlevel4,
.display-authlevel5,
.display-authlevel6,
.display-authlevel7,
.display-authlevel8 {
  display: none !important;
}
/* 
 Progress bread crumb component
 */

ol.progress[data-steps="2"] li {
  width: 50%;
}
ol.progress[data-steps="3"] li {
  width: 33.33%;
}
ol.progress[data-steps="4"] li {
  width: 25%;
}
ol.progress[data-steps="5"] li {
  width: 20%;
}
ol.progress[data-steps="6"] li {
  width: 16.66%;
}
ol.progress[data-steps="7"] li {
  width: 14.28%;
}
ol.progress[data-steps="8"] li {
  width: 12.5%;
}
ol.progress[data-steps="9"] li {
  width: 11.1%;
}
ol.progress[data-steps="10"] li {
  width: 10%;
}
.tick {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADoAAAAtCAMAAADItog5AAAATlBMVEX///////////////////////////////////////////////////////////////////////////////////////////////////////+QPFRFAAAAGXRSTlMAECAwQFBgcICQoKWyuMDE0NjZ4OLr7fDxPNTKWgAAAMVJREFUeAHd07G2gjAQhOEJ4YZLVIyixn3/F7WwMXtkhDlWTvvn6zbYvL8AccmKaHsz0cZq3HLJLZfcMinY7ikFG4q9rkZVWvpRifwtOTYxDOtlbmuxvEW6mmVpNoV3cuCSnGVq5dTWf3fSRLoHySVN+sglynLuuURYtLE2YXaSWCdrBD7aOTLJbY1E+mVvOyK5vZ+Z5HbT185ccsslt1xyS6RgR6xc8jIDot0Doj0Aoj0Coj0Bor0EiPbKJbE3TQJxt0I+AMNLSvpwZf2VAAAAAElFTkSuQmCC);
  background-size: 20px 20px;
  background-repeat: no-repeat;
}
.progress {
  width: 100%;
  list-style: none;
  list-style-image: none;
  padding: 0 0 30px 0;
  float: left;
}
.progress li {
  float: left;
  text-align: center;
  position: relative;
  z-index: 0;
}
.progress .name {
  display: block;
  vertical-align: bottom;
  text-align: center;
  margin-bottom: 1em;
}
/*.progress .done, .progress .active {
    
}*/

.progress .step {
  margin-top: 0.22em;
  color: #B3B3B3;
  font-family: arial;
  font-size: 24px;
  border: 3px solid #cccccc;
  background: linear-gradient(to top, #e6e6e6, #f7f6fc);
  border-radius: 50%;
  line-height: 1.4;
  width: 1.4em;
  height: 1.4em;
  display: inline-block;
  z-index: 10;
}
.progress .step-outer {
  color: #B3B3B3;
  font-size: 24px;
  border: 2px solid #cccccc;
  background: linear-gradient(to top, #e6e6e6, #f7f6fc);
  border-radius: 50%;
  line-height: 2;
  width: 2em;
  height: 2em;
  display: inline-block;
  z-index: 10;
}
/*.progress .done .blank .step {
    color: white;
    font-size: 24px;
    border: 0px solid silver;
    background-color: silver;
    border-radius: 0%;
    line-height: 0;
    width: 0em;
    height: 0em;
    display: inline-block;
    z-index: 10;
}*/

.progress .step:before {
  content: "";
  display: block;
  background-color: #F2F2F2;
  border-top: 3px solid #CDCDCD;
  border-bottom: 1px solid #DFDFDF;
  height: 0.4em;
  width: 50%;
  position: absolute;
  top: 0.8em;
  left: 0;
  z-index: -1;
}
.progress .step:after {
  content: "";
  display: block;
  background-color: #F2F2F2;
  border-top: 3px solid #CDCDCD;
  border-bottom: 1px solid #DFDFDF;
  height: 0.4em;
  width: 50%;
  position: absolute;
  top: 0.8em;
  right: 0;
  z-index: -1;
}
.progress .done .step:after {
  background: #639934;
}
.progress .active .step:before,
.progress .done .step:before {
  background: #639934;
}
.progress li:first-of-type .step:before {
  display: none;
}
.progress li:last-of-type .step:after {
  display: none;
}
.progress .done .step {
  background: #639934;
  color: #fff;
}
.progress .active .step-outer {
  background: #639934;
  border: 1px solid #7AC142;
}
.progress .active .step {
  background: none;
  color: #fff;
  border: 3px solid rgba(0, 0, 0, 0);
}
.step > span > img {
  height: 20px;
}