/* cancels out browser preset styling for main elements listed. */
html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym, em, small, strong, sub, sup, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
}
/* =GENERIC STYLING */
body{
    width:100%;
    height:100%;
    font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
    font-size:69%;
    line-height: 1.3em;
    background:white;
    background-repeat: no-repeat;
    background-position: center 0;
    margin:0;
    padding:0px 0px 50px 0px;
    outline:none;
    border:none;
}

h1 {
    color:#4D4D4D;
    font-size: 3.5em;
    margin: 0.1em 0.5em 0.8em 0em;
    font-weight:normal;
}

h2 {
    color:#4D4D4D;
    font-size: 2.0em;
    margin: 0.1em 0.5em 0.5em 0em;
    font-weight:normal;
}

h3 {
    font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
    font-weight: 400;
    font-style: normal;
    color: #000000;
    font-size: 28px;
    margin-left: 20px;
    margin-top: 30px;
}

a {
        color:#312766;
       text-decoration:none;
}

a:hover {
    text-decoration:underline;
}

/* =LOGIN STYLES= */

#login_header{
    background:#fff;
    margin:0 auto;
    height:100px;
    width:1000px;
}

#login_header_logo {
    width:1000px;
    height:100px;
    overflow:hidden;
    float:left;
    padding-left:10px;
}

#login_header_logo img {
    height:auto:
    vertical-align:middle;
}

.login_container {
    display:block;
    height:auto;
    overflow:auto;
}

#main_content, .top_image {
    display:block;
    width:960px;
    height:auto;
    margin:0 auto 25px;
}

#left_content {
    display:block;
    width:70%;
    float:left;
    height:auto;
}

#right_content {
    display:block;
    width:25%;
    float:right;
    height:auto;
}

#left_content h3 {
    margin:25px;
    margin-bottom:25px;
    margin-top:25px;
}

#left_content h4 {
    color:#000;
    margin-left:25px;
    font-size:16px;
    margin-bottom:25px;
    font-weight:bold;
}

#left_content p {
    font-size:14px;
    color:#6F7072;
    line-height:24px;
    margin-left:25px;
    margin-top:10px;
    margin-bottom:25px;
}

#left_content .redemption_box {
    min-height: 20px;
    margin-bottom: 20px;
    background-color: #EEEEEA;
    border-radius: 7px;
    padding: 19px;
    margin-left: 20px;
    margin-right: 20px;
    position:relative;
}

#left_content .redemption_box .redeem_title {
    color:#000;
    font-size:18px;
    margin-bottom:1em;
    text-align:center;
    font-weight:bold;
    font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
}

#left_content .redemption_box p {
    font-size:14px;
    text-align:center;
    color:#666;
    line-height:20px;
    margin-left:10px;
    margin-top:10px;
    margin-bottom:1em;
    font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
    font-weight:bold;
    /*max-width:50%;*/
}

#left_content .redemption_box #redemption_form input {
    width: 60px;
    font-size: 22px;
    border: 1px solid #999;
    padding: 4px;
    border-radius: 5px;
    position: relative;
    color: #666;
    margin-top: 0;
    margin-right: 3px;
    margin-bottom: 0;
    margin-left: 3px;
}

#registration_form #newport_redeem_code {
    display:block;
    width:320px;
    margin:0 auto;
}

#registration_form #newport_redeem_code input {
    width: 60px;
    font-size: 22px;
    border: 1px solid #999;
    padding: 4px;
    border-radius: 5px;
    position: relative;
    color: #666;
    margin-top: 0;
    margin-right: 3px;
    margin-bottom: 0;
    margin-left: 3px;
    display:inline-block;
}


#left_content #input_code_box {
    display:block;
    width:320px;
    margin:0 auto;
}

.redemption_box h6 {
    font-weight:normal;
    font-size:12px;
}

#redemption_form .register_button {
    display:block;
    margin:0 auto;
}

#redemption_form .register_button,
#login_form .register_button,
#update_pass .register_button,
#forgotten_password .register_button,
#update_password .register_button,
#registration_form .register_button,
.register_button {
    color:#000;
    width:220px;
    font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
    text-align:left;
            background:url('https://cdn.besaving.co.uk/management/media/reward/scottish_register_button.jpg') no-repeat;
        font-size: 16.5px;
    font-weight: normal;
    height: 45px;
    border: none;
    border-radius: 5px;
    padding-left: 10px;
    margin-top:18px;
    cursor:pointer;
    background-position:right -2px;
}

#newport_register_button {
    display:block;
    line-height:45px;
}

#left_content .card_image {
    position:absolute;
    right:25px;
    top:25%;
}

#left_content .redemption_box p.mini {
    font-weight:normal;
}

#left_content .redemption_box .redeem_title.login {
    font-weight:normal;
}

#left_content .redemption_box #back_button {
            color:#000;
                font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
        width:220px;
    text-align:left;
    background:url('https://cdn.besaving.co.uk/management/media/reward/scottish_register_button.jpg') no-repeat;
    font-size: 16.5px;
    font-weight: normal;
    height: 45px;
    border: none;
    border-radius: 5px;
    padding-left: 10px;
    margin-top:18px;
    cursor:pointer;
    background-position:right -2px;
}

#login_form label, #registration_form label, #forgotten_password label, #update_password label {
    display:block;
    width:100%;
    font-size:17px;
    margin-bottom:5px;
    line-height:20px;
}

#login_form input, #registration_form input, #forgotten_password input, #update_password input {
    display:block;
    width:17em;
    margin-bottom:32px;
    background-color:#fff;
    border:1px solid #999;
    border-radius:5px;
    padding:6px;
    font-size:17px;
}

.error_list {
    background-color:#f2dede;
    color:#b94a48;
    border: 1px solid #eed3d7;
    width:90%;
    min-height:20px;
    padding: 8px 15px 8px 14px;
    margin:0;
    margin-bottom:10px;
    font-size:14px;
    line-height:20px;
}

#update_pass label {
    display:block;
    width:100%;
    font-size:17px;
    margin-bottom:5px;
    line-height:20px;
}

#update_pass input {
    display:block;
    width:17em;
    margin-bottom:32px;
    background-color:#fff;
    border:1px solid #999;
    border-radius:5px;
    padding:6px;
    font-size:17px;
}

#main_content.terms p {
    font-size:14px;
    color:#666;
    line-height:20px;
    margin-left:10px;
    margin-top:10px;
    margin-bottom:1em;
            font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B";
    }


.styled-input-single {
    position: relative;
    padding: 20px 0 20px 40px;
    text-align: left;
}

.styled-input-single label {
    cursor: pointer;
    display:inline-block;
}

.styled-input-single label:before, .styled-input-single label:after {
    content: '';
    position: absolute;
    top: 50%;
    border-radius: 50%;
}

.styled-input-single label:before {
    left: 0;
    width: 30px;
    height: 30px;
    margin: -15px 0 0;
    background: #f7f7f7;
    box-shadow: 0 0 5px #555;
}

.styled-input-single label:after {
    left: 5px;
    width: 20px;
    height: 20px;
    margin: -10px 0 0;
    opacity: 0;
    background: #00CC00;
    -webkit-transform: translate3d(-40px, 0, 0) scale(0.5);
    transform: translate3d(-40px, 0, 0) scale(0.5);
    -webkit-transition: opacity 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
}

.styled-input-single input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: -9999px;
    visibility: hidden;
}

.styled-input-single input[type="checkbox"]:checked + label:after {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
}


.styled-input--rounded label:before {
    border-radius: 10px;
}
.styled-input--rounded label:after {
    border-radius: 6px;
}

.styled-input--diamond input[type="radio"]:checked + label:after,
.styled-input--diamond input[type="checkbox"]:checked + label:after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 1;
}

/* To be used with cookieCuttr by Chris Wharton (http://cookiecuttr.com) */

.cc-cookies { left: 0; top: 0; padding: 0.5em 5%; background: #565656; background: rgba(86,86,86,0.95); color: #fff; font-size: 13px; font-weight: 700; text-shadow: 0 -1px 0 rgba(0,0,0,0.35); z-index: 99999; text-align: center; color: #fff; }
.cc-cookies a, .cc-cookies a:hover { color: #fff; text-decoration: underline; }
.cc-cookies a:hover { text-decoration: none; }
.cc-overlay { height: 100%; padding-top: 25%; }
.cc-cookies-error { float: left; width: 90%; text-align: center; margin: 1em 0 2em 0; background: #fff; padding: 2em 5%; border: 1px solid #ccc; font-size: 18px; color: #333; }
.cc-cookies a.cc-cookie-accept, .cc-cookies-error a.cc-cookie-accept, .cc-cookies a.cc-cookie-decline, .cc-cookies-error a.cc-cookie-decline, .cc-cookies a.cc-cookie-reset { display: inline-block; color: #fff; text-decoration: none; background: #7DAF3B; padding: 0.5em 0.75em; border-radius: 3px; box-shadow: 0 0 2px rgba(0,0,0,0.25); text-shadow: 0 -1px 0 rgba(0,0,0,0.35); -o-transition: background 0.5s ease-in; -webkit-transition: background 0.25s ease-in; -moz-transition: background 0.25s ease-in; }
.cc-cookies a.cc-cookie-decline, .cc-cookies-error a.cc-cookie-decline { background: #af3b3b; margin-left: 0.5em; }
.cc-cookies a.cc-cookie-reset { background: #f15b00; }
.cc-cookies a:hover.cc-cookie-accept, .cc-cookies-error a:hover.cc-cookie-accept, .cc-cookies a:hover.cc-cookie-decline, .cc-cookies-error a:hover.cc-cookie-decline, .cc-cookies a:hover.cc-cookie-reset  { background: #000; -o-transition: background 0.5s ease-in; -webkit-transition: background 0.25s ease-in; -moz-transition: background 0.25s ease-in; }
.cc-cookies-error a.cc-cookie-accept, .cc-cookies-error a.cc-cookie-decline { display: block; margin-top: 1em; }
.cc-cookies.cc-discreet { width: auto; padding: 0.5em 1em; left: auto; top: auto; }
.cc-cookies.cc-discreet a.cc-cookie-reset { background: none; text-shadow: none; padding: 0; text-decoration: underline; }
.cc-cookies.cc-discreet a:hover.cc-cookie-reset { text-decoration: none; }



@media (min-width:320px)  and (max-width: 359px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:95%;
        margin:0 auto;
        padding-left:0;
    }

    #login_header_logo img {
        width:100%;
    }

    .login_container {
        width:100%;
    }
    
    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #left_content #input_code_box {
        width:100%;
    }

    #left_content .redemption_box #redemption_form input {
        width:44px;
        font-size:20px;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }

    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:360px)  and (max-width: 374px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:95%;
        margin:0 auto;
        padding-left:0;
    }

    #login_header_logo img {
        width:100%;
    }

    .login_container {
        width:100%;
    }

    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #left_content #input_code_box {
        width:100%;
    }

    #left_content .redemption_box #redemption_form input {
        width:44px;
        font-size:20px;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }
    
    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:375px)  and (max-width: 413px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:360px;
        margin:0 auto;
        padding-left:0;
        display:block;
        float:none;
    }

    #login_header_logo img {
        width:100%;
    }

    .login_container {
        width:100%;
    }

    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #left_content #input_code_box {
        width:100%;
    }

    #left_content .redemption_box #redemption_form input {
        width:55px;
        font-size:22px;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }
    
    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:414px)  and (max-width: 479px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:400px;
        margin:0 auto;
        padding-left:0;
        display:block;
        float:none;
    }

    #login_header_logo img {
        width:100%;
    }

    .login_container {
        width:100%;
    }

    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }
    
    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:480px)  and (max-width: 567px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:400px;
        margin:0 auto;
        padding-left:0;
        display:block;
        float:none;
    }


    .login_container {
        width:100%;
    }

    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }
    
    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:568px)  and (max-width: 639px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:400px;
        margin:0 auto;
        padding-left:0;
        display:block;
        float:none;
    }

    .login_container {
        width:100%;
    }

    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }
    
    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:640px)  and (max-width: 767px) {

    #login_header {
        width:100%;
    }

    #login_header_logo {
        width:400px;
        margin:0 auto;
        padding-left:0;
        display:block;
        float:none;
    }

    .login_container {
        width:100%;
    }

    .top_image img {
        width:100%;
    }

    #main_content,
    .top_image {
        width:100%;
    }

    #left_content {
        width:95%;
        float:none;
        margin:0 auto;
    }

    #left_content h3 {
        line-height:28px;
        text-align:center;
    }

    #left_content .redemption_box {
        padding:5px;
    }

    #left_content p,
    #left_content .redemption_box p {
        margin-left:0;
    }

    #right_content {
        width:95%;
        margin:0 auto;
        float:none;
    }

    #login_form input, #registration_form input {
        width:95%;
    }
        
    #left_content .redemption_box {
        margin-left:0;
        margin-right:0;
    }

    #login_form .register_button,
    #newport_register_button,
    #registration_form .register_button {
        display:block;
        margin:0 auto;
    }

    #right_content {
        width:100%;
    }

    #right_content img {
        display:block;
        margin:0 auto;
    }
}

@media (min-width:768px)  and (max-width: 1023px) {
    
    #main_content {
        width:100%;
    }

    #left_content {
        width:56%;
    }

    #left_content h3 {
        line-height:28px;
    }

    #right_content {
        width:37%;
    }

    .top_image,
    .top_image img {
        width:100%;
    }
}