﻿/* FORMS STYLE SHEET - 2009-01-27 [Steve N: Design Haus] */


/* center column additional layouts
---------------------------------------------------------------*/

.splitcenter
{
    float:left;
    width:213px;
    display:inline;
    margin:0;
    margin-top:20px;
    padding:0;
    border: #EBF7FA 1px solid;
    padding:10px;
}
.splitcenter-margin
{
    margin-right:10px;
}

.fullcenter
{
    float:left;
    width: 100%;
    margin:0;
    padding:0;
    border: green 1px solid;
}




/* Form Styling 1of2 - VERTICAL STYLE
---------------------------------------------------------------*/
input[type=text], 
textarea
{
	border: #98D3E4 1px solid; /* feint blue */
	background-color: #D1EBF3; /* feint blue */
	color:#00204F; /* navy blue */
	font-size: 1em;
	padding:2px;
	font-family: Arial, Helvetica, sans-serif;
}



span.validation
{
	color:#C10538;
}

/*not required*/
/*
hr.forforms
{
    background-color:#EBF7FA;
    color:#EBF7FA;
    border:none;
    height:1px;
    margin-top: 15px; 
}
*/


/* Form Styling 2of2 - HORIZONTAL STYLE
---------------------------------------------------------------*/

/* visual styling only (ignore handheld, projection for now) */
@media screen, print
{
    .formContainer fieldset
    {
        border: 0;
        padding:0px;
        margin:0px;
    }
    .formContainer legend
    {
        display: none;
    }
}


/* section titles */
.formContainer h3
{
    color: #00204F;
    text-transform: none;
    background-color: #ABDBE9;
    padding: .5em;
    margin: 1em 0 !important;
    font-size: 1em;
}
/* ISSUE 889: 
   join/renew renew from lapsed, header row not right in MSIE8 */
.formContainer h3
{
	float: left;
	width: 468px;
}


.formContainer h3 span
{
    float: right;
    font-weight: normal;
}


/*
a series of nested DIVs are used
 div.row        : for each row
 
and within these, three columns
 div.label      : left hand field label
 div.field      : right hand field controls
 div.validation : right-most box to contain validation message
*/
.formContainer .row
{    
    float: left;
    padding: .5em 0;
    width: 480px;
}
.formContainer .label
{    
    float: left;
    width: 140px;
    padding: 0 5px 0 0;
    text-align: right;
}
.formContainer .shorterlabel
{
	width: 40px;
}
.formContainer .field
{    
    width: 235px;
    float: left;
}
.formContainer .longerfield
{    
    width: 335px;
	float: left;    
}


/* validation messages */
.formContainer .validation
{    
    width: 90px;
    padding: 0 5px;
    float: right;
    font-size: .9em;
}

.formContainer .feedback
{
    background-color: #C10538;    
    color: #fff;
}

.formContainer select
{
    background-color:#D1EBF3; /* Faint blue */
    border: 1px solid #98D3E4; /* RYA Brand Sky blue */
    margin-right:3px;
    color: #00204F;
}


/* Special narrowForm to fit in splitcenter */
.narrowForm h3
{
	width: 201px;
}

 .narrowForm .row
{
	width: 213px;
}

 .narrowForm .label
{
	width: 125px;
}

.narrowForm .field
{
	width: 83px;
}


/* Find a training centre - (Centre Column Search Form)
---------------------------------------------------------------*/
.centre-finder
{    
    border:none;
    margin:20px 0px;
    padding:0;
    clear:both;
    float: left;
    width: 100%;
}
.centre-finder legend
{    
    display:none;
    border:none;
    /*border: 1px solid blue;*/
}
.centre-finder input[type=image]
{    

    display:inline-block;
    margin-bottom: -4px !important;
    /*border: 1px solid red;*/
}
.centre-finder input[type=text]
{    
    background-color: #D1EBF3;
    color: #00204F;
    border: 1px solid #98D3E4;
    /*font-size: 0.95em;*/
    padding: 2px 2px 1px 2px;
    font-style: italic;
    margin-right:3px;
    margin-left:3px;
}
.centre-finder select
{
    background-color:#D1EBF3; /* Faint blue */
    border: 1px solid #98D3E4; /* RYA Brand Sky blue */
    margin-right:3px;
    color: #00204F;
    /*font-size: 0.95em;*/
}
.centre-finder a
{
    margin-left:20px;
}
.checker
{
    float:left;
    margin-top: 5px;
    /*border: 1px solid red;*/
    font-size: 0.95em;
}
.centered
{    
    float:left;
    width:100%;
    text-align:left;
    /*border: 1px solid green;*/
    border:none;
}


/* ----- search popup styles ----- */

.hide-button
{
    display:none;
}
#ShowSearchOptions,
.CloseSearchOptions
{
    cursor:pointer;
    text-decoration:underline;
}
#ShowSearchOptions:hover,
.CloseSearchOptions:hover
{
    text-decoration:none;
}
.search-options-placeholder
{
    width:100%;
    height:300px;
}
.search-popup
{
    width:420px;
    margin-left:13px;
    padding:15px;
    background-color:#D1EBF3;
    border: 1px solid #98D3E4;
}

.options-popup
{
    width:420px;
    margin: 10px 0px 0px 0px;
    padding:15px 15px 15px 15px;
    background-color:#D1EBF3;
    border: 1px solid #98D3E4;
    float: left;
}

.search-popup.results
{
    top:920px;
    *top:940px;
}
.search-popup h4, .options-popup h4
{
    float:left;
    clear:both;
    width:100%;
    margin:0px 0px 10px 0px;
    color:#2b5987;
}
.search-popup h4 span, .search-popup h4 a, .options-popup h4 span, .options-popup h4 a
{
    float:left;
    clear:none;
}
.search-popup h4 a, .options-popup h4 a
{
    float:right;
}
.search-popup dt, .options-popup dt, .options-popup dd
.search-popup dd
{
    margin:5px 0px;
}
.search-popup dt, .options-popup dt
{
    float:left;
    width:100%;
    font-weight:bold;
}
.search-popup dd, .options-popup dd
{
    float:left;
    clear:none;
    margin:0px;
    line-height:20px;
}
#CategoryDropDown
{
    margin-bottom:-2px;
}
#TrainingSearchOptions dd
{
    width:100%;
    clear:both;
}
#TrainingSearchOptions dd select
{
    width:200px;
}
.search-popup dd label, .options-popup dd label
{
    float:left;
    clear:none;
    width:120px;
    *width:100px;
}
.search-popup dd input, .options-popup dd input
{
    float:left;
    clear:none;
}
