﻿/*  
    ------------------------------------------------------
    RealMe agency assets
    ------------------------------------------------------

    Table of contents:

    1. Base widget
    2. Typography
    2. Links
    3. Icons
    4. Colour themes

*/
.realme_widget, .realme_button, .realme_popup_position, .realme_login, .realme_create_account, .whats_realme, .realme_link, .realme_popup, .realme_find_out_more {
    position: relative;
}

.realme_login_lockup img, .realme_arrow_top_left .arrow, .realme_arrow_top_right .arrow, .realme_popup_wrapper, .realme_arrow_side_left .arrow, .realme_arrow_side_right .arrow, .realme_icon_find_out_more, .realme_icon_link, .realme_icon_padlock {
    position: absolute;
}

/* Clearfix */
.realme_widget, .realme_secondary_login, .realme_login_lockup, .realme_popup {
    /**
   * For IE 6/7 only
   * Include this rule to trigger hasLayout and contain floats.
   */
    *zoom: 1;
}

    .realme_widget:before, .realme_secondary_login:before, .realme_login_lockup:before, .realme_popup:before, .realme_widget:after, .realme_secondary_login:after, .realme_login_lockup:after, .realme_popup:after {
        content: " ";
        display: table;
    }

    .realme_widget:after, .realme_secondary_login:after, .realme_login_lockup:after, .realme_popup:after {
        clear: both;
    }

.realme_title, .realme_mini_title, .realme_button {
    font-weight: bold;
}

.realme_secondary_login, .realme_secondary_login .realme_popup_position, .realme_login, .realme_create_account, .realme_link, .realme_icon_new_window, .realme_text_icon_new_window {
    display: inline-block;
    vertical-align: bottom;
}

.realme_button, .realme_button_padding, .realme_icon_find_out_more, .realme_icon_link, .realme_icon_padlock {
    display: block;
}

.realme_icon_find_out_more, .realme_icon_link, .realme_icon_padlock, .realme_icon_new_window, .realme_text_icon_new_window {
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 0 0;
}

/* hasLayout hack for IE7 */
.realme_secondary_login, .realme_secondary_login .realme_popup_position, .realme_login, .realme_create_account, .realme_link, .realme_find_out_more, .realme_icon_new_window, .realme_text_icon_new_window {
    *display: inline;
    *zoom: 1;
}

.realme_primary_login, .realme_alternative_login, .realme_assert {
    border-width: 1px;
    border-style: solid;
}

.realme_icon_padlock, .realme_icon_new_window {
    _overflow: hidden;
    /*ie6*/
}

.realme_primary_login, .realme_alternative_login, .realme_assert {
    _width: 320px;
    /*ie6*/
}

/*
	The base RealMe widget
	-----------------------------------------------------
*/
.realme_widget {
    padding: 0.76923em 1.07692em;
    border-color: transparent;
    /* The border-color is modified by each theme */
    font-family: sans-serif;
    color: inherit;
    font-size: 13px;
    /* Set font-size explicitly to avoid cascade from the page. */
    line-height: 1.53846;
    /* Reset the line-height to something senisble inside the widget */
}

    .realme_widget p {
        margin-top: 0.5em;
        margin-bottom: 1em;
    }

    .realme_widget a {
        text-decoration: none;
    }

.realme_login, .realme_create_account, .whats_realme, .realme_link {
    color: #2c5897;
}

    .realme_login:hover, .realme_create_account:hover, .whats_realme:hover, .realme_link:hover, .realme_login:active, .realme_create_account:active, .whats_realme:active, .realme_link:active {
        color: #204170;
        text-decoration: underline;
    }

/*
	Typography
	-----------------------------------------------------
*/
.realme_title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.230769231em;
    /* 16px */
}

.realme_mini_title {
    font-size: 1.076923077em;
    /* 14px */
}

/*
	Buttons
	-----------------------------------------------------
*/
.realme_button {
    line-height: 1;
    margin-top: 1px;
    cursor: pointer;
    color: white;
    border-width: 1px;
    border-style: solid;
    background-color: #3871ae;
    background-repeat: repeat-x;
    /* Things that fancy browsers get */
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #3a78bb), color-stop(100%, #3871ae));
    background-image: -webkit-linear-gradient(#3a78bb, #3871ae);
    background-image: -moz-linear-gradient(#3a78bb, #3871ae);
    background-image: -o-linear-gradient(#3a78bb, #3871ae);
    background-image: linear-gradient(#3a78bb, #3871ae);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    border-color: #1d5794;
    -webkit-appearance: none;
    -webkit-border-image: none;
}

    .realme_button:hover, .realme_button:focus {
        background-color: #2f5f93;
        background-image: none;
        color: #fff;
        border-color: #103154;
    }

.realme_button_padding {
    color: #fff;
    padding: 0.92308em 2.53846em 0.92308em 1.23077em;
}



#realme_goBackButton {
    background-color: red;
}

#realme_goBackButton:hover {
    background-color: #8b0000; 
}

#realme_goBackButton:hover .realme_button_padding {
    background-color: #8b0000;
}


/*
	Top-level widgets
	-----------------------------------------------------
 */
.realme_primary_login {
    max-width: 28em;
    min-width: 16.30769em;
    padding: 1.38462em;
}

    .realme_primary_login p {
        font-size: 14px;
    }

    .realme_primary_login .realme_create_account {
        float: right;
    }

.realme_alternative_login {
    max-width: 18em;
    min-width: 10.30769em;
}

    .realme_alternative_login .realme_title {
        font-size: 1.076923077em;
        margin-bottom: 0.5em;
    }

    .realme_assert .whats_realme, .realme_assert .realme_create_account, .realme_primary_login .whats_realme, .realme_primary_login .realme_create_account, .realme_alternative_login .whats_realme, .realme_alternative_login .realme_create_account {
        margin-top: 0.5em;
    }

.realme_assert {
    max-width: 28em;
}

.realme_secondary_login {
    padding-right: 2.76923em;
    background-image: url('../images/realme/realme-logo-simple-login.png');
    background-repeat: no-repeat;
    background-position: right center;
}

    .realme_secondary_login .realme_login, .realme_secondary_login .realme_link, .realme_secondary_login .realme_create_account {
        padding-right: 1.75em;
        padding-top: 0;
    }

    .realme_secondary_login .realme_pipe {
        border-right: solid 1px;
        padding-left: 0.5em;
    }

        .realme_secondary_login .realme_pipe:first-child {
            padding-left: 0;
        }

    .realme_secondary_login .whats_realme {
        font-weight: bold;
        padding-right: 0.3em;
        padding-left: 0.3em;
        *padding-left: 0.5em;
        padding-top: 0;
    }

    .realme_secondary_login .realme_link {
        margin-right: 0.75em;
    }

    .realme_secondary_login .realme_icon_link {
        right: .615384615em;
    }

/*
	Components
	-----------------------------------------------------
*/
/* Used to separate elements vertically. Can be themed*/
.realme_hr {
    margin: 0;
    border: 0;
    padding: 0.1em 0 0.38462em;
    border-bottom: 1px solid #ddd;
    height: 1px;
}

.realme_login_lockup {
    margin-bottom: 1em;
    _position: relative;
    /*ie6*/
}

/*
    Links
    -----------------------------------------------------
*/
.realme_login, .realme_create_account, .realme_link {
    padding-right: 1.2em;
}

.whats_realme {
    float: left;
}

.realme_btn_margin {
    margin-left: 45px;
}

.realme_link {
    text-decoration: none;
}

/*
	Popup
	-----------------------------------------------------
*/
.realme_arrow_top_left, .realme_arrow_top_right, .realme_arrow_side_left, .realme_arrow_side_right {
    padding-top: 1.2em;
}

    .realme_arrow_top_left .arrow, .realme_arrow_top_right .arrow {
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        border-width: 11px;
        display: block;
        border-bottom-color: #d0d0d0;
        left: -1px;
        top: -22px;
    }

    .ie6 .realme_arrow_top_left .arrow, .realme_arrow_top_left .ie6 .arrow, .ie6 .realme_arrow_top_right .arrow, .realme_arrow_top_right .ie6 .arrow {
        border-right-color: pink;
        border-left-color: pink;
        border-top-color: pink;
        border-top-width: 0;
    }

    .ie6 .realme_arrow_top_left .arrow, .realme_arrow_top_left .ie6 .arrow, .ie6 .realme_arrow_top_right .arrow, .realme_arrow_top_right .ie6 .arrow {
        filter: chroma(color=pink);
        font-size: 0;
        line-height: 0;
    }

    .realme_arrow_top_left .arrow .front, .realme_arrow_top_right .arrow .front {
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        border-width: 10px;
        display: block;
        border-bottom-color: white;
        position: absolute;
        left: -10px;
        bottom: -11px;
    }

    .ie6 .realme_arrow_top_left .arrow .front, .realme_arrow_top_left .ie6 .arrow .front, .ie6 .realme_arrow_top_right .arrow .front, .realme_arrow_top_right .ie6 .arrow .front {
        border-right-color: pink;
        border-left-color: pink;
        border-top-color: pink;
        border-top-width: 0;
    }

    .ie6 .realme_arrow_top_left .arrow .front, .realme_arrow_top_left .ie6 .arrow .front, .ie6 .realme_arrow_top_right .arrow .front, .realme_arrow_top_right .ie6 .arrow .front {
        filter: chroma(color=pink);
        font-size: 0;
        line-height: 0;
    }

    .ie6 .realme_arrow_top_left .arrow .front, .realme_arrow_top_left .ie6 .arrow .front, .ie6 .realme_arrow_top_right .arrow .front, .realme_arrow_top_right .ie6 .arrow .front {
        top: 1px;
    }

    .ie6 label.radio .realme_arrow_top_left .arrow .front, .realme_arrow_top_left .ie6 label.radio .arrow .front, .ie6 label.radio .realme_arrow_top_right .arrow .front, .realme_arrow_top_right .ie6 label.radio .arrow .front {
        display: none;
    }

    .ie6 label.radio .realme_arrow_top_left .arrow, .realme_arrow_top_left .ie6 label.radio .arrow, .ie6 label.radio .realme_arrow_top_right .arrow, .realme_arrow_top_right .ie6 label.radio .arrow {
        display: none;
    }

.realme_popup_wrapper {
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
    opacity: 0;
    visibility: hidden;
    z-index: 2;
    _display: none;
    /*ie6*/
}

.realme_arrow_top_left {
    top: 1.6em;
    left: -1.7em;
}

    .realme_arrow_top_left .arrow {
        left: 1.35em;
        right: auto;
    }

.realme_arrow_top_right {
    top: 1.6em;
    right: -1.7em;
}

    .realme_arrow_top_right .arrow {
        left: auto;
        right: 1.35em;
    }

.realme_arrow_side_left {
    top: -1em;
    left: 100%;
}

    .realme_arrow_side_left .arrow {
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        border-width: 11px;
        display: block;
        border-right-color: #d0d0d0;
        left: -1px;
        top: -22px;
        top: 1.25em;
        left: -22px;
    }

.ie6 .realme_arrow_side_left .arrow {
    filter: chroma(color=pink);
    font-size: 0;
    line-height: 0;
}

.realme_arrow_side_left .arrow .front {
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 10px;
    display: block;
    border-right-color: white;
    position: absolute;
    left: -9px;
    top: -10px;
}

.ie6 .realme_arrow_side_left .arrow .front {
    filter: chroma(color=pink);
    font-size: 0;
    line-height: 0;
}

.ie6 label.radio .realme_arrow_side_left .arrow {
    display: none;
}

.realme_arrow_side_right {
    top: -1em;
    right: 100%;
}

    .realme_arrow_side_right .arrow {
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        border-width: 11px;
        display: block;
        border-left-color: #d0d0d0;
        left: -1px;
        top: -22px;
        top: 1.25em;
        left: auto;
        right: -22px;
    }

.ie6 .realme_arrow_side_right .arrow {
    filter: chroma(color=pink);
    font-size: 0;
    line-height: 0;
}

.realme_arrow_side_right .arrow .front {
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 10px;
    display: block;
    border-left-color: white;
    position: absolute;
    right: -9px;
    top: -10px;
}

.ie6 .realme_arrow_side_right .arrow .front {
    filter: chroma(color=pink);
    font-size: 0;
    line-height: 0;
}

.ie6 label.radio .realme_arrow_side_right .arrow {
    display: none;
}

.realme_popup {
    padding: 0.5em 1.5em 0.5em;
    background-color: #fff;
    border: solid 1px #ddd;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
}

    .realme_popup p, .realme_popup ul, .realme_popup strong, .realme_popup b {
        color: #333;
    }

    .realme_popup p, .realme_popup ul, .realme_popup a {
        line-height: 1.35em;
    }

    .realme_popup ul {
        padding-left: 1em;
        margin-bottom: 1em;
    }

    .realme_popup a {
        color: #2c5897;
    }

        .realme_popup a:hover, .realme_popup a:active {
            color: #204170;
        }

    .realme_popup_title,
    .realme_popup h2 {
        font-size: 1.07692em;
        color: #e1001e;
        margin-bottom: 0.5em;
    }

.no_touch .whats_realme:hover + .realme_popup_wrapper,
.no_touch .realme_popup_wrapper:hover {
    opacity: 1 !important;
    visibility: visible !important;
}

.realme_find_out_more {
    display: inline-block;
    padding-right: 1em;
}

/*
    Icons
    -----------------------------------------------------
*/
.realme_icon_find_out_more {
    top: 0.35em;
    right: 0;
    width: 9px;
    height: 9px;
    background-image: url('../images/realme/realme-icon-new-window-blue.png');
}

.realme_icon_link {
    right: 0;
    bottom: 0;
    width: 9px;
    height: 100%;
    background-image: url('../images/realme/realme-icon-new-window-blue.png');
    background-position: right center;
    _margin-bottom: 2px;
    /*ie6*/
}

.realme_icon_padlock {
    top: 0;
    right: 1em;
    width: 11px;
    height: 100%;
    background-image: url('../images/realme/realme-padlock-white.png');
    background-position: right center;
    _height: 3em;
    /*ie6*/
}

.realme_icon_new_window {
    background-image: url('../images/realme/realme-icon-new-window-white.png');
    width: 9px;
    height: 9px;
    margin-left: 5px;
    vertical-align: baseline;
    position: relative;
    *top: -0.2em;
}

.realme_text_icon_new_window {
    background-image: url('../images/realme/realme-icon-new-window-white.png');
    padding-right: 1.2em;
    background-position: right center;
    *zoom: 1;
    vertical-align: baseline;
}

/*
	Colour themes
	-----------------------------------------------------
*/
.realme_theme_default {
    color: #000 !important;
    border-color: #62b0d1;
    background-color: #eaf4f8;
}

    .realme_theme_default .realme_title, .realme_theme_default .realme_info {
        color: #000;
    }

    .realme_theme_default .realme_hr, .realme_theme_default .realme_pipe {
        border-color: #c0dced;
    }

.realme_theme_light {
    color: #000 !important;
    border-color: #eaf4f8;
    background-color: #fff;
}

    .realme_theme_light .realme_title, .realme_theme_light .realme_info {
        color: #000;
    }

    .realme_theme_light .realme_hr, .realme_theme_light .realme_pipe {
        border-color: #cce5f1;
    }

.realme_theme_dark {
    color: #fff;
    background-color: #3e4d5d;
    border-color: #3e4d5d;
}

    .realme_theme_dark .realme_title, .realme_theme_dark .realme_info {
        color: #fff;
    }

    .realme_theme_dark .realme_hr, .realme_theme_dark .realme_pipe {
        border-color: #587a90;
    }

    .realme_theme_dark .realme_login, .realme_theme_dark .realme_create_account, .realme_theme_dark .whats_realme, .realme_theme_dark .realme_link {
        color: #fff;
    }

    .realme_theme_dark .realme_icon_link {
        background-image: url('../images/realme/realme-icon-new-window-white.png');
    }

    .realme_theme_dark .realme_button {
        border-color: #4683c4;
    }

        .realme_theme_dark .realme_button:hover, .realme_theme_dark .realme_button:active {
            border-color: #3871ae;
        }

    .realme_theme_dark.realme_secondary_login {
        background-image: url('../images/realme/realme-logo-simple-login-dark.png');
    }

.z_index_99 {
    z-index: 99;
}

.z_index_1 {
    z-index: 1;
}

.width_420 {
    width: 420px;
}
