html,
body {
    width:  100%;
    height: 100%;
    margin: 0px;
    font-family:    "Open Sans", arial, sans-serif;
}

a {
    text-decoration: none;
}

ul li,
.pagetitle {
    font-weight:    600;
}

ul li {
    color:      #3f3f3f;
    font-size:  24px;
}

.pagetitle {
    color:          #337AB7;
    font-size:      24px;
    margin-left:    20px;
}

.homepage .pagetitle {
    font-size:      42px;
    margin-left:    0px;
}

.homepage.japanese .pagetitle {
    font-size:      38px;
    margin-left:    0px;
}

.pagetitle.formtitle {
    max-width:  680px;
    margin: 20px 0px 20px 150px;
}

.btn-blue, .btn.primary, .btn-primary {
    background-image:   none;
    filter:             progid:DXImageTransform.Microsoft.gradient(enabled=false);
    border-radius:      0;
    border-style:       solid;
    border-width:       1px;
    box-shadow:         none;
    text-shadow:        none;
    padding:            3px 11px;
    border:             1px solid #428bca;
    background-color:   #428bca;
    color:              #ffffff;
    -webkit-appearance: none;
}

[class^="sprite-"], [class*=" sprite-"] {
    display:                inline-block;
    width:                  20px;
    height:                 20px;
    margin-top:             -2px;
    line-height:            20px;
    vertical-align:         text-top;
    background-image:       url("https://secureimage.securedataimages.com/images/common/others/fruit2-sprite-16.png");
    background-position:    20px 20px;
    background-repeat:      no-repeat;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), not all {
    [class^="sprite-"], [class*=" sprite-"] {
      background-image: url("https://secureimage.securedataimages.com/images/common/others/fruit2-sprite-11@2x.png");
      background-size: 64px 960px;
    }
}
.help-header {
    width:      100%;
    min-width:  400px;
    /*border: 1px solid red;*/
}

.help-page-wrap {
    width:          100%;
    min-width:      400px;
    border-top:     1px solid #3f3f3f;
    border-bottom:  1px solid #3f3f3f;
}

.help-header-content {
    max-width:  870px;
    height:     75px;
    margin:     0px auto;
}

.help-header .help-logo {
    float:          left;
    width:          50%;
    margin-top:     18px;
    margin-left:    15px;
}

.help-header .help-logo img {
    width:      170px;
    height:     38px;
}

.help-header .help-logo .pagetitle {
    display:    none;
}

.help-header .help-nav {
    width:          auto;
    text-align:     right;
    float:          right;
    margin-top:     36px;
    margin-right:   15px;
}

.help-header .help-nav a {
    display:            block;
    float:              left;
    padding:            1px 10px;
    text-decoration:    none;
    text-transform:     uppercase;
    color:              #3f3f3f;
    font-size:          14px;
    font-weight:        bold;
}

.spanish .help-header .help-nav a {
    font-size:  12px;
}

.help-header .help-nav a.active{
    color:          #acacac;
}

.help-header .help-nav a:hover {
    color:          #acacac;
}

.help-header .help-form-phone {
      text-align: right;
      width: 170px;
      float: right;
      margin-top: 28px;
      margin-right: 25px;
      clear: both;
      font-size: 14px;
}

.chinese .help-header .help-form-phone { width: 235px }
.korean .help-header .help-form-phone { width:  230px }
.italian .help-header .help-form-phone { width: 216px }
.german .help-header .help-form-phone { width:  185px }
.swedish .help-header .help-form-phone { width: 182px }

.help-header .help-form-phone .help-phone-icon-link {
    float:          left;
    margin-left:    22px;
}

.help-content {
    max-width:  870px;
    margin:     0px auto;
    min-height: 330px;
}

.help-form-top {
    clear:      both;
    max-width:  680px;
    margin:     0px auto 10px;
    height:     14px
}

.billing-container {
    display:            block;
    padding:            0px;
    margin:             0px;
    border:             none;
    background-color:   transparent;
    height:             auto;
}

.help-bottom {
    max-width:  680px;
    margin:     0px auto;
    clear:      both;
}

.help-form-required {
    font-size:      11px;
    font-weight:    100;
    font-style:     italic;
    color:          #ff0000;
    float:          right;
    margin-right:   10px;
}

.formtitle .help-form-required {
    display: none;
}

.help-form-row label {
    display:        block;
    float:          left;
    clear:          left;
    width:          150px;
    text-align:     right;
    margin-right:   10px;
    font-weight:    700;
    line-height:    32px;
    vertical-align: 8px;
}

.help-form-row.callbacknumber_note {
    height: 18px;
}

.help-form-row.callbacknumber_note label {
    height: 1px;
}

.help-form-row.callbacknumber_note .note {
    height:     16px;
    font-size:  14px;
}

.help-form-row {
    position:   relative;
    margin:     5px;
    clear:      left;
}

.help-footer {
    margin-top: 15px;
    width:      100%;
    min-width:  400px;
    height:     150px;
    /*border: 1px solid blue;*/
}

.help-footer-content {
    min-width:              320px;
    max-width:              870px;
    height:                 100%;
    margin:                 0px auto;
    text-align:             center;
    /*background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/FFN_help_sm.png);
    background-repeat:      no-repeat;
    background-position:    center top;*/
}

.help-footer-left {
    width:                  auto;
    min-width:              56px;
    min-height:             63px;
    text-align:             left;
    float:                  left;
    clear:                  left;
    background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/lock.png);
    background-position:    0px 0px;
    background-repeat:      no-repeat;
}

.help-footer-right {
    width:      80%;
    text-align: right;
    float:      right;
}

.help-footer .help-copyright {
	display:                block;
    float:                  right;
    font-size:              13px;
    line-height:            19px;
    background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/FFN_help_sm.png);
    background-repeat:      no-repeat;
    background-position:    left top;
    width:                  245px;
}

.korean .help-footer .help-copyright { width:  290px }
.german .help-footer .help-copyright { width:  250px }
.portuguese .help-footer .help-copyright { width:  255px }
.italian .help-footer .help-copyright { width:  260px }
.spanish .help-footer .help-copyright { width:  265px }
.french .help-footer .help-copyright { width:  275px }

.help-footer .help-footer-logo {
    background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/FFN_help_sm.png);
    background-repeat:      no-repeat;
    width:                  75px;
    height:                 75px;
    background-position:    -3px 0px;
    float:                  right;
}

.help-footer .lang-dropdown {
    float:      left;
    clear:      both;
    width:      100%;
    text-align: center;
    margin:     10px auto;
}

/* homepage only */

.homepage .help-page-wrap {
    position : relative;
    background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/ffnhelp_main_image.jpg);
    background-repeat:      no-repeat;
    background-position:    center 0px;
    background-color:   #f3f0ec;
    border-bottom:      none;
    border-top:         none;
}

.homepage .help-content {
    height:                 565px;
}

.homepage .help-home-top {
    padding-left:   15px;
}

.homepage .help-content ul {
    list-style-type:        disc;
    list-style-position:    inside;
    margin:                 0px auto;
    padding-left:           0px;
}

.homepage .site-list {
    overflow: hidden;
    box-sizing: border-box;
    padding: 20px 0 40px 0;
}

.homepage .site-list .content-wrapper {
    height: 100%;
    margin: 0 auto;
}

.homepage .site-list ul {
    overflow:auto;
    list-style: none;
    padding:0;
    width:70%;
    margin:auto;
}

.homepage .site-list ul li {
    float: left;
    height: 50px;
    width: 25%;
    box-sizing: border-box;
    margin: 0;
    padding: 10px 8px;
    margin-bottom: 20px;
    vertical-align: middle;
    text-align: center;
  
}
.homepage .site-list img {
    max-height: 30px;
    max-width: 100%;
    resize: both;
}
.homepage .site-list img[alt="slim"]{
   position:relative;
   right:15%;
   bottom:10px;
   min-height:120%;
}
.homepage .site-list img[alt="TravelFriendFinder"]{
   position:relative;
   right:20%;
   max-height:80%;
}
.homepage .site-list img[alt="Sportscartracker"]{
   position:relative;
   right:15%;
   max-height:70%;
}
.homepage .site-list img[alt="Supremepsychics"]{
   min-height:160%;
   position: relative;
   bottom: 10px;
}
.homepage .site-list img[alt="medley"]{
   position:relative;
   min-height:170%;
   bottom:10px;
}
.homepage .site-list img[alt="perfectmatch.com"]{
   position:relative;
   min-height:140%;
}
.homepage .site-list img[alt="BREAKTHRU.com"]{
   position:relative;
   min-height:140%;
}

      
.help-content p,
.help-content ul li {
    font-size:  24px;
    color:      #3f3f3f;
    max-width:  870px;
    margin:     22px auto;
}

.french .help-content ul li { font-size:  20px }
.japanese .help-content ul li,
.swedish .help-content ul li { font-size:  21px }
.german .help-content ul li { font-size:  22px }

.help-content p {
    font-size:  14px;
    padding:    0px 10px 0px 20px;
}

.help-content .table-of-contents {
    max-width:  500px;
    margin:     20px 10px 0px 20px;
}

.help-calltoaction {
    /*max-width:      870px;*/
    margin:         0px auto 20px;
	font-size:      24px;
    color:          #3f3f3f;
}

.help-calltoaction .phonenumber {
    font-size:      40px;
    color:          #3f3f3f;
}

.help-tollfree {
    font-size: 12px;
}

.help-callormail {
    margin:         0px;
    padding:        0px;
    line-height:    75px;
}

.help-emailbutton {
    clear:  none;
    margin: 10px 10px 15px;
    border: none;
}

.help-form-row input,
.help-form-row select {
    height: 28px;
}

.help-form-row textarea {
    padding:    0px;
    height:     270px;
}

.help-form-row input,
.help-form-row select,
.help-form-row textarea {
    width:          490px;
    line-height:    24px;
    font-size:      13px;
}

.help-form-row select {
    width:  492px;
    height: 34px;
}

.help-form-row input.btn {
    width:  auto;
}

.help-form-row input.shortfield {
    width:  initial;
}

.help-form-row input.shortfield[size="4"] {
    width: 40px
}

.help-form-row input.shortfield[size="2"] {
    width: 20px
}

.help-form-row .cardnumber_plaintext {
    line-height: 32px;
}

.help-form-row .cardnumber_plaintext,
.help-form-row input.shortfield {
    float:          left;
    margin-left:    5px;
    margin-bottom:  5px;
    font-size:		14px;
    padding:		0px 1px;
}

.help-form-row input.shortfield.first {
    margin-left:    10px;
}

.help-form-row span.req {
    display:    inline;
    visibility: hidden;
}

.help-form-row .note {
    float:          left;
    font-style:     italic;
    font-weight:    300;
    display:        block;
    height:         28px;
    padding:        0px;
    padding-left:   10px;
}

.help-form-row.required span.req{
    color:      #ff0000;
    visibility: visible;
}

.help-form-row.details span.req {
    position:   relative;
    top:        -260px;
}

.help-form-row .sprite-secure {
    float:  left;
    margin: 3px 2px;
}

.help-form-row .sprite-secure.narrow {
    display:    none;
    float:      left;
}

.help-form-row .sprite-secure.full {
    display: block;
}

.help-form-row.submit {
    text-align: center;
}

.partialcard_text {
    width:          270px;
    float:          left;
    clear:          none;
    display:        block;
    font-style:     italic;
    padding:        0px;
    padding-left:   5px;
    font-size:      12px;
    text-align:     right;
}

.help-nav-screen {
    width:              auto;
    height:             auto;
    display:            block;
    background-color:   transparent;
    position:           absolute;
    top:                0px;
    left:               0px;
    right:              0px;
    bottom:             0px;
    z-index:            1000;
}


.chinese .help-cookies-link {
    display:    block;
    width:      300px;
}

.chinese .help-copyright {
    width:  300px;
}

.portuguese .help-form-row.callbacknumber_note .note { font-size: 13px; }
.spanish .help-form-row.callbacknumber_note .note { font-size: 12px; }
.french .help-form-row.callbacknumber_note .note { font-size: 10px; }


.sprite-green-phone{        background-position: -232px -864px; }
.sprite-green-phone-alt{    background-position: -232px -893px; }
.sprite-secure {            background-position: -266px -577px; }
.sprite-secure-alt {        background-position: -266px -542px; }

/*end desktop styles*/

/*start mobile styles*/
@media (max-width: 700px) {
    /* header */
    
    .help-header-content {
        max-width:              870px;
        height:                 75px;
        margin:                 0px auto;
        background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/ffnhelp_logo_170x38.png);
        background-repeat:      no-repeat;
        background-position:    center 20px;
    }

    .help-header .help-nav {
        float:          none;
        margin-top:     0px;
        padding-top:    20px;
        margin-left:    20px;
    }

    .help-header .help-logo {
        display:    none;
    }

    .help-header .help-nav a {
        display:            none;
        position:           absolute;
        z-index:            1100;
        background-color:   #3f3f3f;
        color:              #ffffff;
        top:                -20px;
        left:               -20px;
        width:              100%;
        height:             100px;
        text-align:         center;
        line-height:        100px;
        font-size:          24px;
        opacity:            0.95;
        min-width:          400px;
    }

    
    .help-header .help-nav a.home-link {
        top:    0px;
    }
    
    .help-header .help-nav a.email-link {
        top:    101px;
    }
    
    .help-header .help-nav a.about-link {
        top:    202px;
    }
    
    .help-header .help-nav a.show {
        display:    block;
    }
    
    .help-header .help-nav .help-nav-mobile-icon {
        display:                block;
        background-image:       url(https://secureimage.securedataimages.com/images/js/vice/icons_mobile_sprite_v5-compressor.png);
        background-repeat:      no-repeat;
        background-position:    -974px -494px;
        height:                 50px;
        width:                  50px;
    }

    .help-header .help-form-phone,    
    .chinese .help-header .help-form-phone,
    .korean .help-header .help-form-phone,
    .italian .help-header .help-form-phone,
    .german .help-header .help-form-phone,
    .swedish .help-header .help-form-phone {
        color:          transparent;
        line-height:    0px;
        width:          50px;
        height:         50px;
        clear:          none;
        float:          right;
        position:       relative;
        top:            -80px;
        margin-right:   15px;
    }
    
    .help-header .help-form-phone .help-phone-icon-link {
        float:  none;
        margin: 0;
    }
    .help-header .help-form-phone .phonenumber {
        display:    none;
    }
    
    /*.help-header .help-form-phone .phonenumber a {
        color: transparent;
    }*/
    
    .help-header .help-form-phone .sprite-green-phone {
        display:              block;
        border-radius:        25px;
        width:                50px;
        height:               50px;
        background-color:     #00B386;
        background-position:  -971px -251px;
        background-image:     url(https://secureimage.securedataimages.com/images/js/vice/icons_mobile_sprite_v5-compressor.png);
        background-repeat:    no-repeat;
        background-size:      initial;
        top:                  0px;
        right:                0px;
        left:                 auto;
    }
    
    .help-footer-content {
        background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/FFN_help_sm.png);
        background-repeat:      no-repeat;
        background-position:    center top;
    }
    .spanish .help-footer-content {
        background-position-x: calc(100% - 204px);
    }
    .korean .help-footer-content {
        background-position-x: calc(100% - 228px);
    }
    
    .help-footer .help-copyright {
        background: none;
        width:      auto;
    }
    
    /* homepage only */
    .homepage .help-header {
        margin-top:             0px;
        background-image:       url(https://secureimage.securedataimages.com/images/ffnhelp/ffnhelp_main_image.jpg);
        background-repeat:      no-repeat;
        background-position:    -520px 0px;
        height:                 565px;
        padding:                0px;
        border-bottom:          none;
    }
    
    .homepage .help-header-content {
        margin:     0px;
        background: none;
    }
    
    
    .homepage .help-header .help-logo {
        margin-top:     180px;
        margin-left:    25px;
        width:          240px;
    }

    .homepage .help-header .help-logo .pagetitle {
        margin:     0px;
        display:    block;
    }
    
    .homepage .help-header .help-logo {
        display:    block;
    }

    .homepage .site-list {
        top: -122px;
        bottom: auto;
        padding-bottom: 50px;
    }
    .homepage .site-list ul {
        width:90%;
        padding-left:3%;
    }
    .homepage .site-list ul li {
        width: 50%;
    }
    .homepage .site-list img[alt="slim"]{
        right:0;
    }
    .homepage .site-list img[alt="TravelFriendFinder"]{
        right:0;
    }
    .homepage .site-list img[alt="Sportscartracker"]{
        right:0;
    }    
    .homepage .site-list img[alt="Supremepsychics"]{
        right:0;
        bottom:10px;
    }    
    .homepage .site-list img[alt="medley"]{
        right:0;
        bottom:10px;
    }    
    
    /* page content */

    .help-page-wrap {
        min-width:      380px;
        border-bottom:  none;
        border-top:     none;
    }

    .pagetitle,
    .pagetitle.formtitle {
        margin: 20px 0px 20px 20px;
    }

    .pagetitle.formtitle .help-form-required {
        display:        block;
        margin-top:     6px;
        margin-right:   -32px;
    }

    .help-form-top {
        display: none;
    }

    .help-form-row label {
        display: none;
    }
    
    .help-form-row input,
    .help-form-row input.btn,
    .help-form-row select,
    .help-form-row select option,
    .help-form-row textarea {
        width:      96%;
        height:     40px;
        font-size:  23px;
    }

    .german .help-form-row input { font-size:  18px }
    .italian .help-form-row input,
    .french .help-form-row input { font-size:  20px }
    .portuguese .help-form-row input,
    .spanish .help-form-row input { font-size:  21px }

    .help-form-row input,
    .help-form-row input.btn,
    .help-form-row textarea {
        padding:    5px 0px;
    }

    .help-form-row select {
        height:     50px;
        width:      97%
    }

    .help-form-row textarea {
        height:     270px;
    }

    .billing-container {
        width:              initial;
        background-color:   #f3f3f3;
        margin:             15px 2%;
        padding:            5px 0px;
    }    
    
    .billing-container .help-form-row input {
        width:  94%;
    }

    .help-form-row input.shortfield {
        font-size:      24px;
        margin-left:    3%;
    }

    .help-form-row input.shortfield[size="4"] {
        width: 65px
    }

    .help-form-row input.shortfield[size="2"] {
        width: 33px
    }
    
    .help-form-row input.shortfield.first {
        margin-left:    1%;
    }


    .help-form-row .cardnumber_plaintext {
        line-height:    40px;
        font-size:      24px;
        margin-left:    3%;
    }
    
    .help-form-row.cardnumber {
        height:     55px;
        min-width:  399px;
    }
    
    .help-form-row .sprite-secure.narrow {
        background-image:       url(https://secureimage.securedataimages.com/images/common/others/fruit2-sprite-16.png);
        background-size:        550px;
        display:                block;
        width:                  40px;
        height:                 40px;
        background-position:    -499px -1095px;
        
    }
    
    .help-form-row .sprite-secure.full {
        display: none;
    }
    
    
    .partialcard_text {
        width:          auto;
        float:          left;
        clear:          both;
        padding:        0px;
        padding-left:   15px;
        margin-bottom:  9px;
        font-size:      24px;
        text-align:     left;
        position:       relative;
        right:          10px;
    }

    .help-form-row.callbacknumber_note .note {
        height:     auto;
        font-size:  24px;
    }


    /* homepage only */
    .homepage .help-page-wrap {
        background: none;
        min-width: 400px;
    }

    .homepage .help-content {
        background: none;
        height:     400px;
    }
    .help-content ul li {  
      font-size: 18px !important;
    }
    
    .homepage .help-home-top h1.pagetitle {
        display:    none;
    }
    
    .homepage .help-calltoaction {
        position:   relative;
        left:       -7px;
    }
    
    .homepage .help-callormail {
        text-align:     center;
        color:          transparent;
        line-height:    20px;
    }
    
    .homepage .help-callormail .phonenumber {
        display:            block;
        width:              100%;
        background-color:   #4AB483;
        color:              #ffffff;
        line-height:        90px;
        font-size:          40px;
    }

    .homepage .help-callormail .phonenumber .sprite {
        margin-top:             20px;
        margin-left:            20px;
        display:                block;
        float:                  left;
        background-image:       url(https://secureimage.securedataimages.com/images/js/vice/icons_mobile_sprite_v5-compressor.png);
        background-repeat:      no-repeat;
        background-position:    -968px -254px;
        height:                 50px;
        width:                  50px;
    }
    .homepage .help-callormail .help-emailbutton {
        display:            block;
        background:         none;
        background-color:   #F0EFEB;
        color:              #3f3f3f;
        padding:            0px;
        height:             90px;
        line-height:        90px;
        font-size:          30px;
        margin:             0px;
    }

    .homepage .help-callormail .help-emailbutton .sprite {
        margin-top:             20px;
        margin-left:            20px;
        display:                block;
        float:                  left;        
        background-image:       url(https://secureimage.securedataimages.com/images/js/vice/icons_mobile_sprite_v5-compressor.png);
        background-repeat:      no-repeat;
        background-position:    -94px -254px;
        height:                 50px;
        width:                  50px;
    }
    
    .homepage .help-callormail br {
        display: none;
    }
    /* footer */
    
    .help-footer-content {
        background-size:    65px;
    }
    
    .help-footer-left {
        margin-left:    15px;
    }
    
     .help-footer-right {
        margin-right:   15px;
    }
    
}

@media (max-width: 500px) {
    .help-content ul li {  
      font-size: 16px !important;
    }
    .help-footer-right {
        width:      75%;
    }
    .homepage .help-callormail .help-emailbutton {
        font-size: 25px;
    }
}
/*start mobile styles*/
@media (max-width: 400px) {
    /* homepage only */
    .homepage .help-header {
        background-position:    -293px 0px;
        background-size:        800px;
        height:                 340px;
        min-width:              400px;
    }
    
    .homepage .help-header .help-logo {
        top:            475px;
        width:          auto;
        margin-top:     122px;
        margin-left:    5px;
    }
    
    .homepage .help-header .help-logo img {
        width:  128px;
        height: 29px;
    }
    
    .homepage .help-header h1.pagetitle {
        font-size:      28px;
        padding-top:    4px;
        height:         38px;
        width:          145px;
    }
    
    .homepage .help-home-top h1.pagetitle {
        top:        0px;
        width:      auto;
    }
    
    .homepage .help-home-top {
        top:        -85px;
    }
    
    .homepage .help-content {
        height: 200px;
        min-height:auto;        
    }
    
    .homepage .help-content p, .help-content ul li {
        font-size: 12px;
        margin: 10px auto;
    }
    
    .homepage .help-callormail {
        line-height:    5px;
    }
    
    .homepage .help-callormail .phonenumber {
        line-height:    50px;
        font-size:      24px;
    }
    
    .homepage .help-callormail .phonenumber .sprite {
        margin-top:             10px;
        margin-left:            10px;
        background-position:    -768px -203px;
        background-size:        945px;
        height:                 30px;
        width:                  30px;
    }
    
    .homepage .help-callormail .help-emailbutton {
        height:         50px;
        line-height:    50px;
        font-size:      22px;
    }
    
    .homepage .help-callormail .help-emailbutton .sprite {
        margin-top:             10px;
        margin-left:            10px;
        background-position:    -62px -165px;
        background-size:        767px;
        height:                 30px;
        width:                  30px;
    }

    .homepage .site-list {
        top: -110px;
    }
    .homepage .site-list ul {
        padding-left: 5%;
        width:90%;
    }
    .help-form-row input.shortfield {
        margin-left:    1%;
    }
    
    .help-form-row .cardnumber_plaintext {
        margin-left:    1%;
    }
    
    .partialcard_text {
        width:  360px;
    }

    .help-footer-content {
        background-size:    50px;
    }
    
    .help-footer .help-footer-logo {
        width:                  50px;
        height:                 50px;
        background-position:    0px 0px;
        background-size:        45px;
    }
    
    .help-footer-left {
        min-width:              52px;
        min-height:             42px;
        background-position:    10px 0px;
        background-size:        42px;
    }
    
    .help-footer .help-copyright {
        font-size:      12px;
        line-height:    15px;
        padding-right:  10px;
    }
    
}


/* Bootstrap Helpers */
.centered {     text-align: center; }
.pull-right {   float:      right;  }
.pull-left {    float:      left;   }
.hide {         display:    none;   }
.show {         display:    block;  }
.invisible {    visibility: hidden; }