@charset "UTF-8";
/* INCLUDES
--------------------------------------- */
/*! https://github.com/nathansmith/960-Grid-System/blob/master/code/css/reset.css */
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
dialog,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
font,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
meter,
nav,
object,
ol,
output,
p,
pre,
progress,
q,
rp,
rt,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video,
xmp {
  border: 0;
  margin: 0;
  padding: 0;
  font-size: 100%; }

/*
I don't like this. - Calvin
html,
body {
	height: 100%;
}
*/
html {
  -webkit-text-size-adjust: 100%; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  /*
  	Override the default (display: inline) for
  	browsers that do not recognize HTML5 tags.
  
  	IE8 (and lower) requires a shiv:
  	http://ejohn.org/blog/html5-shiv
  */
  display: block; }

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal; }

b,
strong {
  /*
  	Makes browsers agree.
  	IE + Opera = font-weight: bold.
  	Gecko + WebKit = font-weight: bolder.
  */
  font-weight: bold; }

img {
  color: transparent;
  font-size: 0;
  vertical-align: middle;
  /*
  	For IE.
  	http://css-tricks.com/ie-fix-bicubic-scaling-for-images
  */
  -ms-interpolation-mode: bicubic; }

ol,
ul {
  list-style: none; }

li {
  /*
  	For IE6 + IE7:
  
  	"display: list-item" keeps bullets from
  	disappearing if hasLayout is triggered.
  */
  display: list-item; }

th,
td,
caption {
  font-weight: normal;
  vertical-align: top;
  text-align: left; }

q {
  quotes: none; }

q:before,
q:after {
  content: '';
  content: none; }

sub,
sup,
small {
  font-size: 75%; }

sub,
sup {
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

svg {
  /*
  	For IE9. Without, occasionally draws shapes
  	outside the boundaries of <svg> rectangle.
  */
  overflow: hidden; }

/*! Yoyo reset */
a {
  /*
  	Remove underline from links.
  */
  text-decoration: none; }

input,
textarea,
select {
  /*
  	Inputs should inherit font at full size.
  */
  font-family: inherit;
  font-size: 100%; }

/*
Clearfix.
*/
.grid_row:before, .row:before, .grid_row:after, .row:after {
  content: " ";
  display: table; }
.grid_row:after, .row:after {
  clear: both; }

/*
 * 'rem' is a Sass mixin that converts pixel values to rem values for whatever property is passed to it.
 * It returns two lines of code — one of the regular pixel values (for IE), and another with the
 * converted rem values (for everyone else). Special thanks to Chris Epstein (http://chriseppstein.github.com)
 * and Martin Bavio (http://martinbavio.com) for the help and code!
 * 
 * Sample input:
 * .element {
 *   @include rem('padding',10px 0 2px 5px);
 * }
 * 
 * Sample output:
 * .element {
 *   padding: 10px 0 2px 5px;
 *   padding: 1rem 0 0.2rem 0.5rem;
 * }
 * 
 */
/*
Truncates the decimal part of a floating point number.
*/
/* $Grids
================================================== */
.grid {
  width: auto;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  clear: both;
  list-style: none; }
  header > .grid {
    padding-top: 10px;
    padding-top: 1rem; }

.grid_row, .row {
  width: 100%;
  margin-bottom: 60px;
  margin-bottom: 6rem;
  clear: both;
  list-style: none; }
  @media only screen and (max-width: 719px) {
    .grid_row, .row {
      margin-bottom: 0; } }
  header .grid_row, header .row {
    margin-bottom: 0; }
  .nav-main .grid_row, .nav-account .grid_row, .nav-main .row, .nav-account .row {
    margin-bottom: 0; }
  .grid_row .grid_row:last-of-type, .row .grid_row:last-of-type {
    margin-bottom: 0; }

.row {
  margin-bottom: 30px; }

.grid-1 {
  width: 3.33333%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-2 {
  width: 11.66667%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-3 {
  width: 20%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-4 {
  width: 28.33333%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-5 {
  width: 36.66667%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-6 {
  width: 45%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-7 {
  width: 53.33333%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-8 {
  width: 61.66667%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-9 {
  width: 70%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-10 {
  width: 78.33333%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-11 {
  width: 86.66667%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

.grid-12 {
  width: 95%;
  margin-left: 2.5%;
  margin-right: 2.5%; }

[class^="grid-"] {
  float: left; }

header[role="banner"] .grid-8 {
  position: relative;
  left: 33.33333%; }
header[role="banner"] .grid-4 {
  position: relative;
  left: -66.66667%; }
header[role="banner"] .grid-12 {
  margin-bottom: 0; }
@media only screen and (max-width: 1200px) {
  header[role="banner"] .grid-8 {
    left: 0;
    width: 95%; }
  header[role="banner"] .grid-4 {
    left: 0;
    width: 95%; } }

@media only screen and (max-width: 719px) {
  [class^="grid-"] {
    width: 95%; } }
@media only screen and (min-width: 720px) {
  .grid-3 {
    width: 45%; }

  .grid-4 {
    width: 45%; }
    .grid-4.orphan {
      width: 100%;
      margin-left: 0;
      margin-right: 0; }
      .grid-4.orphan .module {
        float: left;
        display: inline;
        width: 45%;
        margin-left: 2.5%;
        margin-right: 2.5%; }
        .grid-4.orphan .module + .module {
          margin-top: 0; }

  .grid-8 {
    width: 45%; } }
@media only screen and (min-width: 480px) and (max-width: 1023px) {
  .grid-3:nth-child(1) {
    margin-bottom: 60px; }
    .grid-3:nth-child(1) .module {
      margin-bottom: 0; }
  .grid-3:nth-child(2) {
    margin-bottom: 60px; }
    .grid-3:nth-child(2) .module {
      margin-bottom: 0; } }

@media only screen and (min-width: 480px) and (max-width: 1023px) {
  .grid-4:nth-child(1) {
    margin-bottom: 60px; }
    .grid-4:nth-child(1) .module {
      margin-bottom: 0; }
  .grid-4:nth-child(2) {
    margin-bottom: 60px; }
    .grid-4:nth-child(2) .module {
      margin-bottom: 0; } }
body > header .grid-4:nth-child(2) {
  margin-bottom: 0; }
  body > header .grid-4:nth-child(2) .module {
    margin-bottom: 0; }

@media only screen and (min-width: 1024px) {
  .is-hidden-on-mobile {
    display: none; } }

@media only screen and (min-width: 1024px) {
  .grid-3 {
    width: 20%;
    margin-bottom: 0; }

  .grid-4 {
    width: 28.33333%; }
    .grid-4.orphan {
      width: 28.33333%;
      margin-left: 2.5%;
      margin-right: 2.5%; }
      .grid-4.orphan .module {
        display: inline;
        width: 100%;
        margin-left: 0;
        margin-right: 0; }
        .grid-4.orphan .module + .module {
          margin-top: 20px;
          margin-top: 2rem; }

  .grid-8 {
    width: 61.66667%; } }
@media only screen and (min-width: 720px) and (max-width: 1024px) {
  .focus .grid-8 {
    width: 61.66667%; }
  .focus .grid-4 {
    width: 28.33333%; } }

@media only screen and (min-width: 720px) and (max-width: 1024px) {
  .grid-4.small-to-wide {
    width: 95%; } }

.ie8 body, .ie8 .grid {
  min-width: 1200px; }
  .ie8 body header[role=banner], .ie8 .grid header[role=banner] {
    border-bottom: none; }
  .ie8 body .global-body, .ie8 .grid .global-body {
    position: relative; }
  .ie8 body .nav-main, .ie8 .grid .nav-main {
    background: #593B83 url(/images/tiles/header.gif) 0 0 repeat;
    border-bottom: 2px solid #73559D;
    margin-bottom: 40px;
    margin-bottom: 4rem;
    position: relative;
    z-index: 50;
    padding-top: 25px;
    padding-top: 2.5rem; }
    .ie8 body .nav-main ul li a, .ie8 .grid .nav-main ul li a {
      padding-left: 15px;
      padding-left: 1.5rem;
      padding-right: 15px;
      padding-right: 1.5rem; }
      .ie8 body .nav-main ul li a:hover, .ie8 .grid .nav-main ul li a:hover {
        background: #DBB00A;
        filter: none; }
    .ie8 body .nav-main ul ul, .ie8 .grid .nav-main ul ul {
      display: none; }
    .ie8 body .nav-main ul .show-sub ul, .ie8 .grid .nav-main ul .show-sub ul {
      display: block; }
  .ie8 body .nav-mobile, .ie8 .grid .nav-mobile {
    display: none; }
  .ie8 body .n-myaccount ul > li, .ie8 .grid .n-myaccount ul > li {
    background: #251440; }
    .ie8 body .n-myaccount ul > li > a:hover, .ie8 .grid .n-myaccount ul > li > a:hover {
      background: #DBB00A;
      filter: none; }
  .ie8 body .account-subnav .m-myaccount ul > li > a:hover, .ie8 body .account-subnav .m-myaccount ul > li > a.is-selected, .ie8 .grid .account-subnav .m-myaccount ul > li > a:hover, .ie8 .grid .account-subnav .m-myaccount ul > li > a.is-selected {
    filter: none;
    background: #cfa30a;
    border-top: 1px solid #e7b80a;
    border-bottom: 1px solid #a9830a; }
  .ie8 body .nav-account, .ie8 .grid .nav-account {
    width: 100%;
    position: absolute;
    top: -40px;
    top: -4rem;
    right: 0;
    z-index: 300; }
  .ie8 body .n-registration li .n-subnav, .ie8 .grid .n-registration li .n-subnav {
    display: none; }
  .ie8 body .n-registration .show-sub .n-subnav, .ie8 .grid .n-registration .show-sub .n-subnav {
    display: block;
    z-index: 50; }
  .ie8 body .is-hidden-on-mobile, .ie8 .grid .is-hidden-on-mobile {
    display: none; }
  .ie8 body #btnSubmitUser, .ie8 .grid #btnSubmitUser {
    padding-left: 16px;
    padding-left: 1.6rem;
    padding-right: 16px;
    padding-right: 1.6rem; }
  .ie8 body .module, .ie8 .grid .module {
    background: #55368C;
    filter: none; }
    .ie8 body .module.is-flat, .ie8 .grid .module.is-flat {
      filter: none;
      background: none; }
    .ie8 body .module.branding-heartradio, .ie8 .grid .module.branding-heartradio {
      background: #d4133e; }
    .ie8 body .module.m-nearestquiz, .ie8 .grid .module.m-nearestquiz {
      filter: none; }
    .ie8 body .module.m-quotepraise, .ie8 .grid .module.m-quotepraise {
      filter: none; }
  .ie8 body .button, .ie8 .grid .button {
    background: #66b24c;
    filter: none; }
    .ie8 body .button:hover, .ie8 .grid .button:hover {
      background: #DBB00A; }
  .ie8 body .facebookesque, .ie8 .grid .facebookesque {
    background: #4a6ea9; }
    .ie8 body .facebookesque:hover, .ie8 .grid .facebookesque:hover {
      background: #6989bd; }
  .ie8 body #n-registration, .ie8 .grid #n-registration {
    padding-top: 20px;
    padding-top: 2rem; }
    .ie8 body #n-registration .n-registeroptions ul li, .ie8 .grid #n-registration .n-registeroptions ul li {
      width: 350px;
      width: 35rem; }
.ie8 .placeholder {
  color: #b19cd2; }
.ie8 .m-pagination ul li a {
  background: #6b44b1;
  border-color: #8765c3;
  filter: none;
  color: #fff; }
  .ie8 .m-pagination ul li a.page-number {
    padding: 8px 12px;
    padding: 0.8rem 1.2rem; }
  .ie8 .m-pagination ul li a:hover, .ie8 .m-pagination ul li a.selected {
    filter: none;
    background: #bf9309; }
  .ie8 .m-pagination ul li a.disabled {
    filter: none;
    background: #aaa;
    color: #ccc;
    cursor: default;
    border-color: #c3c3c3;
    border-bottom: none; }

.ie9 .button {
  background: #66b24c; }
  .ie9 .button:hover {
    background: #DBB00A; }
.ie9 .facebookesque {
  background: #4a6ea9; }
.ie9 #nav-main ul li a:hover {
  background: #DBB00A;
  filter: none; }
.ie9 .n-myaccount ul > li {
  background: #251440; }
  .ie9 .n-myaccount ul > li > a:hover {
    background: #DBB00A;
    filter: none; }
.ie9 .account-subnav .m-myaccount ul > li > a:hover, .ie9 .account-subnav .m-myaccount ul > li > a.is-selected {
  filter: none;
  background: #cfa30a;
  border-top: 1px solid #e7b80a;
  border-bottom: 1px solid #a9830a; }
.ie9 .button {
  background: #66b24c;
  filter: none; }
  .ie9 .button:hover {
    background: #DBB00A; }
.ie9 .facebookesque {
  background: #4a6ea9; }
  .ie9 .facebookesque:hover {
    background: #6989bd; }
.ie9 :-ms-input-placeholder {
  color: #b19cd2; }

/* colours */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body {
  background: url(../images/pound_repeat.png);
  background-repeat: repeat;
  font-family: "Trebuchet MS", Tahoma, Arial;
  font-size: 1.0em; }

h1 {
  font-size: 1.4em;
  color: #555;
  margin: 0px 0px 10px 0px; }

h3 {
  font-size: 1.2em;
  color: #555;
  margin: 0px 0px 10px 0px; }

h2 {
  font-size: 1.2em;
  color: #555;
  margin: 0px 0px 10px 0px; }

.product-list-panel h2 {
  margin: 0px 0px 10px 10px; }

h2.list-title {
  font-size: 1.2em;
  color: #e21126;
  font-family: 'Archivo Black', sans-serif; }

p {
  font-size: 1.0em;
  
  margin: 10px; }

.header-content {
  background: #fff;
  padding: 10px 0px 0px 0px; }

.header-content a img {
  width: 100%; }
  @media (min-width: 600px) {
    .header-content a img {
      width: 600px; } }

.header-subtitle {
  margin: 10px 0px 10px 0px;
  font-size: 1.0em; }

.playbutton {
  display: inline-block;
  cursor: pointer;
  border: 1px solid #68c5ff;
  border-bottom: none;
  -webkit-border-radius: 5px;
  /* Android ≤ 1.6, iOS 1-3.2, Safari 3-4 */
  border-radius: 5px;
  /* Android 2.1+, Chrome, Firefox 4+, IE 9+, iOS 4+, Opera 10.50+, Safari 5+ */
  /* useful if you don't want a bg color from leaking outside the border: */
  background-clip: padding-box;
  /* Android 2.2+, Chrome, Firefox 4+, IE 9+, iOS 4+, Opera 10.50+, Safari 4+ */
  background: #3499d8;
  /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYxNDJhMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0YzJlN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top, #68c5ff 0%, #006db1 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #68c5ff), color-stop(100%, #006db1));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #68c5ff 0%, #006db1 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #68c5ff 0%, #006db1 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #68c5ff 0%, #006db1 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #68c5ff 0%, #006db1 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topcolor', endColorstr='$bottomcolor',GradientType=0 );
  /* IE6-8 */
  color: #eee;
  font-family: 'Asap', sans-serif;
  font-weight: 700;
  font-size: 14px;
  font-size: 1.4rem;
  padding: 5px 18px;
  padding: 0.5rem 1.8rem;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.65);
  -webkit-box-shadow: 0 0 1px 2px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 1px 2px rgba(0, 0, 0, 0.25);
  margin: 0; }
  .playbutton.small {
    font-size: 14px;
    font-size: 1.4rem;
    padding: 8px 8px;
    padding: 0.8rem 0.8rem; }
  .playbutton:hover {
    border: 1px solid #f6c838;
    border-bottom: none;
    background: #d4a80a;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYxNDJhMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0YzJlN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #e9be0b 0%, #bf9309 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e9be0b), color-stop(100%, #bf9309));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e9be0b 0%, #bf9309 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e9be0b 0%, #bf9309 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e9be0b 0%, #bf9309 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #e9be0b 0%, #bf9309 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topcolor', endColorstr='$bottomcolor',GradientType=0 );
    /* IE6-8 */
    color: #714c00; }
  .playbutton.facebookesque {
    background: #4a6ea9;
    -webkit-border-radius: 0;
    border-radius: 0;
    background-clip: border-box;
    color: #fff;
    text-shadow: none;
    border-color: #4a6ea9;
    margin-bottom: 20px;
    margin-bottom: 2rem;
    position: relative;
    padding-left: 30px;
    padding-left: 3rem; }
    .playbutton.facebookesque:after {
      content: " ";
      width: 24px;
      width: 2.4rem;
      height: 24px;
      height: 2.4rem;
      display: block;
      position: absolute;
      left: 10px;
      left: 1rem;
      top: 50%;
      margin-top: -12px;
      margin-top: -1.2rem;
      background: url(/images/sprite/sprites.svg) no-repeat -950px 0px; }
      .no-svg .playbutton.facebookesque:after {
        background-image: url(/images/sprite/sprites.png); }
    .playbutton.facebookesque:hover {
      background: #577bb5; }
  .playbutton + .button {
    margin-left: 10px;
    margin-left: 1rem; }

.page-content {
  background-color: #fff;
  padding: 20px 10px 20px 10px; }

.cat-list-container {
  margin: 0px 0px 0px 0px; }

.af-block {
  border: 2px solid #0079c5;
  -webkit-border-radius: 10px;
  /* Android ≤ 1.6, iOS 1-3.2, Safari 3-4 */
  border-radius: 10px;
  /* Android 2.1+, Chrome, Firefox 4+, IE 9+, iOS 4+, Opera 10.50+, Safari 5+ */
  /* useful if you don't want a bg color from leaking outside the border: */
  background-clip: padding-box;
  /* Android 2.2+, Chrome, Firefox 4+, IE 9+, iOS 4+, Opera 10.50+, Safari 4+ */
  display: block;
  margin: 0px 0px 15px 0px;
  position: relative; 
  min-height: 170px;
  
  }

.af-block .section1 {
  display: inline-block;
  width: 40%;
  vertical-align: top;
  margin-bottom: 10px; }
  @media (min-width: 400px) {
    .af-block .section1 {
      width: 30%; } }
  @media (min-width: 600px) {
    .af-block .section1 {
      width: 25%;
      margin-bottom: 30px; } }
  @media (min-width: 800px) {
    .af-block .section1 {
      width: 16%;
      margin-bottom: 30px; } }
  @media (min-width: 1000px) {
    .af-block .section1 {
      margin-bottom: 10px; } }

.af-block .section2 {
  display: inline-block;
  width: 58%;
  vertical-align: top; }
  @media (min-width: 400px) {
    .af-block .section2 {
      width: 68%; } }
  @media (min-width: 600px) {
    .af-block .section2 {
      width: 63%; } }
  @media (min-width: 800px) {
    .af-block .section2 {
      width: 68%; } }

.af-block .section2 div {
  display: inline-block;
  margin-right: 10px; }

.af-block .section3 {
  
  
  
  display: inline-block; }

.af-block .af-banner {
  margin: 10px 10px 0px 10px; }

.af-block .af-banner a img {
  width: 90px; }
  @media (min-width: 500px) {
    .af-block .af-banner a img {
      width: 125px; } }

.af-block .af-title {
  font-size: 1.3em;
  margin: 10px 0px 0px 10px; }
  @media (min-width: 400px) {
    .af-block .af-title {
      font-size: 1.4em; } }
  @media (min-width: 500px) {
    .af-block .af-title {
      margin-top: 70px; } }
  @media (min-width: 650px) {
    .af-block .af-title {
      margin-top: 10px; } }
  @media (min-width: 1100px) {
    .af-block .af-title {
      font-size: 1.6em; } }

.af-block .af-offer-figures {
  font-size: 1.0em;
  color: #e21126;
  margin: 5px 0px 10px 10px; }
  @media (min-width: 400px) {
    .af-block .af-offer-figures {
      font-size: 1.2em; } }
  @media (min-width: 1100px) {
    .af-block .af-offer-figures {
      font-size: 1.3em; } }

.af-block .af-offer-figures span {
  margin: 0px 10px 0px 0px; }

.af-block .star-container {
  margin: 0px 0px 0px 10px; }

.af-block .star-container img {
  width: 20px; }
  @media (min-width: 500px) {
    .af-block .star-container img {
      width: 28px; } }
  @media (min-width: 1100px) {
    .af-block .star-container img {
      width: 32px; } }

.af-block .af-text1 {
  font-size: 0.8em;
  margin: 0px 10px 0px 10px; }
  @media (min-width: 650px) {
    .af-block .af-text1 {
      position: absolute;
      top: 65px;
      left: 150px; } }

.af-block .af-title a {
  color: #e21126; }

.af-block .af-title a:visited {
  color: #e21126; }

.af-block .af-playbutton {
  text-align: center;
  margin-bottom: 10px; }
  @media (min-width: 500px) {
    .af-block .af-playbutton {
      position: absolute;
      top: 15px;
      right: 10px; } }

.af-block .af-review-link-div {
  margin: 8px 0px 15px 0px;
  font-size: 1.0em; }

.latest-offers {
  margin-top: 10px;
  padding: 20px;
  background-color: #fff; }

.latest-offers ul li {
  margin-bottom: 10px; }

.link-list-div ul {
  margin: 0px 0px 0px 10px; }

.link-list-div ul li a {
  font-size: 1.4em; }

.review-product-link {
  font-size: 1.4em;
  margin-left: 10px; }

.product-detail-line {
  margin: 0px 0px 10px 10px; }

.product-detail-line span {
  color: #009E00;
  font-size: 1.0em; }
  @media (min-width: 800px) {
    .product-detail-line span {
      font-size: 1.2em; } }

.product-table-line {
  margin: 0px 0px 10px 10px; }

.product-table-line span {
  color: #009E00;
  font-size: 1.0em; }
  @media (min-width: 800px) {
    .product-table-line span {
      font-size: 1.2em; } }

.bottom-menu {
  padding: 0px 20px 10px 20px;
  background-color: #fff; }

.bottom-menu ul li {
  display: inline-block;
  margin: 0px 10px 10px 0px; }

.bottom-menu ul li a {
  color: #222; }

.footer-copyright {
  margin-top: 10px;
  padding: 10px;
  background-color: #fff; }

.gaware-div {
  padding: 10px;
  background-color: #fff;
  margin-bottom: 10px; }

/* nav styles  */
/* end of nav styles */

/*# sourceMappingURL=styles.css.map */