/** Newsletter section */
.newsletter {  
    clear: both; 
    min-height: 120px; 
    margin-bottom: 1em;
}
.newsletter p { 
    padding: 0 20px 0 0; 
    margin-left: 175px;
}
.newsletter-icon { 
    padding: 0 15px 0 0; 
    width: 150px; 
    height: 115px; 
    float: left;
}
.newsletter strong label { 
    display: inline-block; 
    padding-left: 0.5em; 
}
#newsletter-options { 
    float: left; 
    width: 405px; 
}

/** Signup form */
#subscription_submit { 
}
#newsletter_contact_form,
#newsletter_click { 
    float: right; 
    width: 450px;
    clear:right;
}
#subscription-content { 
    margin-bottom: 300px; 
}

#newsletter_contact_form label {
    padding-left: 3px;
}
#newsletter_contact_form .field-email label,
#newsletter_contact_form .field-country label {
    width: 75px;
}
#newsletter_contact_form .field-country .help {
    margin-left: 85px;
}
form div.row label.required {
    background-image: none;
}
#id_email {
    width: 300px;
}
#contact-info .row {
    float: left;
}
#contact-info .row input {
    clear: left;
    display: block;
}
#contact-info .row label {
    width: auto;
    display: block;
}
#contact-info .field-title {
    width: 83px;
}
#contact-info .field-first_name,
#contact-info .field-last_name {
    width: 165px;
}
ul.errorlist, form div.radio ul.errorlist {
    display: none;
}
.error label {
    color: #B50000;
}
form div.row label.required {
    font-weight: normal;
}

.feature { padding: 1em; }
.feature.primary { font-size: 1.2em; }

/** Unsubscribe form */
#unsubscribe-form { padding: 15px 0 0 0; }
#unsubscribe-form input { margin-left: 10px; }
.description { -moz-border-radius:8px;  -webkit-border-radius: 8px; border-radius: 8px; background-color: #5A4099; padding: 10px; margin: 20px 50px 10px 50px;}
.description p { color: #FFF; margin: 0 30px; padding: 0 0 5px 0;}
#unsubscribe-message { font-weight: bold; font-size: 16px; text-align: center;}
.extra-message { margin: 30px 50px 10px 50px; }

/* 
 * The state classes are a little bit complex, because of the doubble class bug in IE6
 * The state class looks like this:
 * 
 * .ui-radio-state[-checked][-disabled][-hover] or .ui-checkbox-state[-checked][-disabled][-hover]
 * 
 * Examples:
 * 
 * .ui-radio-state-checked (simply checked) 
 * .ui-radio-state-checked-hover (checked and hovered/focused)
 * .ui-radio-state-hover (unchecked and hovered/focused)
 * 
 * If you don´t have to deal with the doubble class bug of IE6 you can also use the simple ui-checkbox-checked, ui-checkbox-disabled, ui-checkbox-hover state-classnames (or: ui-radio-checked...)
 * and the ui-radio/ui-checkbox role-classnames.
 * 
 */

.ui-radio-state-disabled,
.ui-radio-state-checked-disabled,
.ui-radio-state-disabled-hover,
.ui-radio-state-checked-disabled-hover {
    color: #999;
}
span.ui-checkbox,
span.ui-radio {
    display: block;
    float: left;
    width: 21px;
    height: 16px;
    background: url('//media.gadventures.com/media-server/static/css/images/radio_sprite.png?988fdcbc7977') 0 -29px no-repeat;
}
span.ui-helper-hidden {
    display: none;
}
span.ui-radio-state-hover,
span.ui-checkbox-state-hover {
    background-position: 0 -86px;
}
span.ui-checkbox-state-checked {
    background-position: 0 0;
}
span.ui-checkbox-state-checked-hover {
    background-position: 0 -56px;
}
span.ui-radio-state-checked-disabled-hover,
span.ui-radio-state-checked-disabled,
span.ui-radio-state-checked {
    background-position: 0 -29px;
}
span.ui-radio-state-checked-hover {
    background-position: 0 -56px;
}
.ui-radio-disabled,
.ui-checkbox-disabled {
    opacity: 0.7;
}