/* 
    CONNECT THEME - CUSTOM OVERRIDE
*/
/*
This stylesheet can be used to override all custom.css styles used in the selected/configured theme.
Add styles to this stylesheet file if you want to change the look and feel of a themes page elements./*

NOTE:
*DO NOT*
	Change other css files in the 'App_Themes' directory, as the changes will not be persisted when a new
	version of the software is installed.

*DO NOT*
	Add styles that effect the grid layout and positioning of page elements.
    eg. Do not override any ('span' 'span-fluid' 'span-container') styles.
    (if you do, you will break all the grid and complex media query theme settings!!).

/*------------------------
HOW AND WHAT TO STYLE HERE:
We suggest that you only edit the following settings so you can customise your version of join@home.
    
    Text (font family, size(em), weight, color),
    Borders (style,width,colour)
	Images (Add any custom images to the (Styles/images) folder.

PLEASE REFER TO THE JOIN@HOME CUSTOMISATION GUIDE WHEN CREATING CUSTOM OVERRIDE STYLING.
    Any styling added here will be used across all screen sizes unless overuled by classes in mediaoverride.css
----------------------------------------------------------------------------------------------------------------------------*/


/*--------------------------------------------------------------------------------------------------------------------------*/
/* PAGE BASE
    Styles used on the base containers that structure the pages. Only change the background colours used here if required.
    Uncomment the necessary style and  edit the color value so it matches your design.
    Uncomment (html):
*/
/*html {background:#EFEFFE;}*/

/*--------------------------------------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------------------------------------*/
/* PAGE HEADER BACKGROUND
    Header background – apply a background image with your companies branding replacing the image template (.png format).
    Retain the existing dimensions of the file 2024pixels wide x 218pixels high. This image should only hold imagery that
    allows the title text (company name and strapline) to remain readable.
    DO NOT under any circumstances add any embedded text in to this graphic!
    Only real text defined in the j@h configurator should be used in the page header.

    Add your branded background image to the Styles directory:   OnlineReg2.Web/Styles/images/header-bac.png
    
    NOTE: Don’t change/add new image positioning css values.
    Uncomment the header background style (.header_inner):
    
*/
/*.header_inner { background-image: url("../images/header-bac.png") }*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/*  COMPANY LOGO
    Replace the existing template image with your own logo (.png format)
    but retain the same size dimensions of 50pixels high by minimum width of 123pixels and maximum width of 480pixels.
    
    Add your company logo.png image to the directory:   OnlineReg2.Web/Styles/images/logo.png
    If you change the image file name update the reference in the style. 
    
    NOTE: Don’t change the image positioning css values.
    Uncomment the style (#company-logo):
*/
/*
#company-logo {background: url(../images/logo.png) no-repeat 0 0 rgba(0, 0, 0, 0) };}
*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------------------------------------------------*/
/* PAGE BODY
    Apply a color to the body of the page so it matches your design.
    Uncomment (body): 
*/
/*body {background-color:#FFFFFF;}*/
/*--------------------------------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------------------------------------------------*/
/* INNER CONTENT MAIN
    this is the area between the Progress Steps bar and the Footer that contains the content and the Membership Summary column.
    Uncomment to apply.
*/
/*
#contentAndSummaryContainer {background-color:#FFFFFF;}
*/
/*--------------------------------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------------------------------------------------*/
/* INNER BODY CONTENT
    This is the left hand inner container to the left of the Membership Details column.
    Uncomment to apply.
*/
/*
#content .content_inner{}
*/
/*---------------------------------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------------------------------------------------*/
/* MEMBERSHIP DETAILS SUMMARY COLUMN
    This is the right hand column container to the right of the page content. Change the background and border colors.
    Uncomment to apply.
*/
/*
#summarybar {
    background-color:#FFFF;
    border-bottom:1px solid #B14A9C;
}
*/
/*
#summarybar .inner {
    background-color: #F7F7FF;
    border-bottom: medium none #B14A9C;
    border-left: 1px solid #B14A9C;
}
*/
/*---------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* PROGRESS STEPS CONTAINER BAR
    This is the bar that holds all the registration step titles eg Site > Initial Details > Membership > Full Details > Pay
    Change the colour of the bar if required.
    Uncomment the style (#progressbar):
*/
/*#progressbar{
    background: -moz-linear-gradient(center bottom , #B14A9C 0%, #BFBFBF 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-bottom:1px solid #B14A9C;
}*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* PROGRESS STEP ICON
    Change the icon to the left of the progress step titles.
    Upload a replacement image in to: OnlineReg2.Web/Styles/images/progress-step-arrow.fw.png
    Retain the dimensions and size of the existing icon 15pixels wide x 21pixels high.
    Uncomment the style (.progressStep_container):
*/
/*.progressStep_container{background:url("../images/progress-step-arrow.fw.png");}*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* PROGRESS STEP TEXT
    Change the progress step titles color and font weight if required.
*/
/*.progressbox_text{color:#FFFFFF;}*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* MEMBERSHIP SUMMARY DETAILS
    Change the bar and text styling in this right hand column container.
*/
/* Header Bar Top - Change the background color and text color.*/
/*.summarybar_title{
    background-color: #B14A9C;
    color: #FFFFFF;
}*/
/* Sub Header Bar - Change the background graduation color (or change to solid color), border and text color.*/
/*#summarybar .inner .titlebar{
    background: -moz-linear-gradient(center bottom , #F0DDEC 0%, #E1BAD9 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #FFFFFF;
    color: #4A1F41;
}*/
/* Summary column body text - Change the text color and background (match to container background color) color. */
/*.subcontentleft{
    background-color: rgba(0, 0, 0, 0);
    color: #000000;
}*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* TYPOGRAPHY Styles
    change the font family:
*/
/*body, input, button, select, textarea, site-h4, legend, gscaptcha, #finish-reg-header, #footer-support-telephone-no, footer-link {
    font-family:"Trebuchet MS",Droid Sans,Helvetica Neue,Arial,sans-serif;
}*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* TABLES
    change the table styles:
*/
/* Table Header - only change the background and border colors*/
/*.selMemTableHead {
    background: #D5F0EC;
    border-bottom: 1px solid #DDDDDD;
    color: #333333;
}*/
/* Table Row - only change the background and border colors */
/*.selMemTableRow {
    border-bottom: 1px solid #DDDDDD;
    background:#FFFFFF;
}*/
/* Table Alternate Row - only change the background and border colors */
/*.selMemTableAltRow {
    background-color: #E1F1FD;
    border-bottom: 1px solid #DDDDDD;
}*/
/*------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------------------------------*/
/* FOOTER */
/*  Footer container - add a graduated or solid color here
#footer {
    background: -moz-linear-gradient(center bottom , #EEEEEE 0%, #EEEEEE 100%);
    background-color: #EEEEEE;
}

/* Telephone Number defined in the configurator - change the text color. */
/*#footer-support-telephone-no {color:#0064CD;}*/

/* Privacy Policy link defined in the configurator - change the text color. */
/*#Privacy-Policy-Text a {color:#0064CD;}*/
/* hover state*/
/*#Privacy-Policy-Text a:hover {}*/

/*------------------------------------------------------------------------------------------------------------------------------*/