/** 
* Sign Up Page 
*/
.clearfix {
  *zoom: 1;
}
.clearfix:before, .clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}

.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.input-block-level {
  display: block;
  width: 100%;
  min-height: 28px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/* CSS3 Two Tone borders - IE9+ */
/* Fix for responsive images - use on IMG tag */
/* Mobile icons for retina display */
/** 
 * Mixin divides width of parent between children. It requires the parent to 
 * have a size class representing the number of children (eg: class="size_3"). 
 * It will take this and divide the width by that number of elements.
 *
 * Note: In silverstripe templates you can use $Count on a set of items you 
 * are about to loop throught to get the total number. EG:
 * <ul class="size_{$Menu.Count}">
 */
.SignUpPage #mainNav {
  display: none;
}
.SignUpPage #SearchGroup {
  margin-top: 48px;
}
.SignUpPage #SearchGroup form, .SignUpPage #SearchGroup .like {
  display: none;
}
.SignUpPage footer {
  min-height: 100px;
  background: #efefef;
  border: none;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
}
.SignUpPage footer .footer-nav, .SignUpPage footer .footer-bottom {
  display: none;
}
.SignUpPage .layout {
  text-align: center;
}
.SignUpPage .layout .content {
  width: 100%;
  margin-top: 40px;
}
.SignUpPage .layout .form-section {
  margin-top: 20px;
}
.SignUpPage .layout .form-image {
  float: left;
  width: 30%;
}
.SignUpPage .layout .form-wrap {
  box-sizing: border-box;
  float: left;
  text-align: left;
  padding: 20px 30px;
  width: 100%;
  border: 1px solid #d1d1d1;
  -webkit-border-radius: 9px;
  -moz-border-radius: 9px;
  border-radius: 9px;
  background-color: whitesmoke;
  background-image: -ms-linear-gradient(top, #efefef, white);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#efefef), to(white));
  background-image: -webkit-linear-gradient(top, #efefef, white);
  background-image: -o-linear-gradient(top, #efefef, white);
  background-image: -moz-linear-gradient(top, #efefef, white);
  background-image: linear-gradient(top, #efefef, white);
  background-repeat: repeat-x;
  text-align: center;
}
#IE8 .SignUpPage .layout .form-wrap {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEFEFEF', endColorstr='#FFFFFFFF', GradientType=0);
}
.SignUpPage .layout .form-wrap h3 {
  font-size: 1.8em;
  text-align: center;
  color: #ce1824 !important;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset {
  padding: 30px;
  text-align: left;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field {
  float: left;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text {
  text-align: left;
  width: 46.9%;
  display: inline-block;
  margin-right: 5%;
  margin-bottom: 20px;
  /* Literal field */
  /*Email field*/
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text.no-margin {
  margin-right: 0;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text label {
  color: #494949;
  width: auto;
  float: none;
  text-align: left;
  margin-left: 3px;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text.nolabel {
  padding: 0px;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text.email {
  width: 100%;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text.email input.email {
  width: 100% !important;
  max-width: 100% !important;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text.date input {
  width: 100%;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text input {
  margin-bottom: 0px;
  max-width: 100% !important;
  border: none;
  border-bottom: 1px solid #d1d1d1;
  color: #494949;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text input::-webkit-input-placeholder {
  font-weight: light;
  font-size: 1.1em;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text input:-moz-placeholder {
  font-weight: light;
  font-size: 1.1em;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text input::-moz-placeholder {
  font-weight: light;
  font-size: 1.1em;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text input:-ms-input-placeholder {
  font-weight: light;
  font-size: 1.1em;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.datedropdown {
  text-align: left;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .field.datedropdown select {
  display: inline-block;
  width: 32.3%;
  margin-bottom: 0px;
  height: 32px;
  border: none;
  border-bottom: 1px solid #d1d1d1;
  color: #494949;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset .Actions, .SignUpPage .layout .form-wrap form#Form_Form fieldset .btn-toolbar {
  float: left;
  width: 100%;
}
.SignUpPage .layout .form-wrap form#Form_Form fieldset input.action {
  float: right;
  font-weight: light;
  background-color: #af1520;
  background-image: -ms-linear-gradient(top, #ce1824, #80101a);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ce1824), to(#80101a));
  background-image: -webkit-linear-gradient(top, #ce1824, #80101a);
  background-image: -o-linear-gradient(top, #ce1824, #80101a);
  background-image: -moz-linear-gradient(top, #ce1824, #80101a);
  background-image: linear-gradient(top, #ce1824, #80101a);
  background-repeat: repeat-x;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
  text-shadow: none;
  border: none;
  color: white;
  padding: 5px 15px !important;
  letter-spacing: 2px;
  text-align: center;
}
#IE8 .SignUpPage .layout .form-wrap form#Form_Form fieldset input.action {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFCE1824', endColorstr='#FF80101A', GradientType=0);
}

/* Finish Page */
.FormCompletionPage .bg.container {
  padding: 0px;
}
.FormCompletionPage .banner-hero {
  margin-bottom: 20px;
}
.FormCompletionPage .banner-hero .row-fluid, .FormCompletionPage .banner-hero .row-fluid [class*="span"] {
  margin: 0px;
}
.FormCompletionPage .banner-hero .row-fluid .span4, .FormCompletionPage .banner-hero .row-fluid .span8, .FormCompletionPage .banner-hero .row-fluid [class*="span"] .span4, .FormCompletionPage .banner-hero .row-fluid [class*="span"] .span8 {
  margin: 0px;
}
.FormCompletionPage .banner-hero .row-fluid .span4, .FormCompletionPage .banner-hero .row-fluid [class*="span"] .span4 {
  width: 34.18183%;
}
.FormCompletionPage .banner-intro {
  width: 100%;
  height: 250px;
  background-color: #ce1824;
}
.FormCompletionPage .banner-intro .intro-inner {
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  height: 250px;
  padding: 20px 40px;
  color: white;
  overflow: hidden;
}
.FormCompletionPage .banner-intro .intro-inner .ps-table, .FormCompletionPage .banner-intro .intro-inner .ps-cell {
  height: 210px;
}
.FormCompletionPage .banner-intro .intro-inner h1.banner-heading {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: white;
  /*font-size:6.5em;*/
  letter-spacing: 0.004em;
  margin-top: 0px;
  line-height: 0.9em;
}
.FormCompletionPage .banner-intro .intro-inner p {
  color: white;
  font-size: 1.1em;
  line-height: 1.4em;
}
.FormCompletionPage .banner-image {
  width: 100%;
  height: 250px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.FormCompletionPage .side-image {
  margin-left: 15%;
}
.FormCompletionPage #main .content {
  padding: 0 40px;
}
.FormCompletionPage #main .content .link-video {
  width: 500px !important;
  max-width: 100% !important;
  margin: 0 auto;
}
.FormCompletionPage .sharing {
  display: block;
  text-align: right;
  margin-bottom: 20px;
}
.FormCompletionPage .st_facebook_large .stLarge {
  background-image: url(../../images/fb.png) !important;
}
.FormCompletionPage .st_email_large .stLarge {
  position: relative;
  top: 2px;
  background-image: url(../../images/mail.png) !important;
}
.FormCompletionPage .st_twitter_large .stLarge {
  position: relative;
  top: 2px;
  background-image: url(../../images/tw.png) !important;
}

#IE8 .SignUpPage .layout .form-wrap form#Form_Form fieldset .field.datedropdown {
  text-align: left;
}
#IE8 .SignUpPage .layout .form-wrap form#Form_Form fieldset .field.datedropdown select {
  display: inline-block;
  width: 31.3%;
  margin-bottom: 0px;
  height: 32px;
  border: none;
  border-bottom: 1px solid #d1d1d1;
  color: #494949;
}

@media (max-width: 1200px) {
  .FormCompletionPage .banner-hero .row-fluid .span4, .FormCompletionPage .banner-hero .row-fluid [class*="span"] .span4 {
    width: 34.044%;
  }
  .FormCompletionPage .banner-intro .intro-inner h1.banner-heading {
    /*font-size:4.5em;*/
  }
}
@media (max-width: 979px) {
  .SignUpPage .layout .content {
    width: 100%;
  }
  .SignUpPage .layout .form-wrap, .SignUpPage .layout .form-image {
    width: 100%;
    margin-bottom: 20px;
  }

  .FormCompletionPage .bg.container, .FormCompletionPage .container.layout {
    width: 734px;
    padding-left: 0px;
    padding-right: 0px;
  }
  .FormCompletionPage .banner-hero .row-fluid, .FormCompletionPage .banner-hero .row-fluid [class*="span"] {
    width: 100%;
  }
  .FormCompletionPage .banner-hero .row-fluid .span4, .FormCompletionPage .banner-hero .row-fluid .span8 {
    width: 100%;
  }
  .FormCompletionPage .banner-hero .banner-intro {
    height: 150px;
  }
  .FormCompletionPage .banner-hero .banner-intro .intro-inner {
    height: 150px;
    padding: 20px 40px;
  }
  .FormCompletionPage .banner-hero .banner-intro .ps-table, .FormCompletionPage .banner-hero .banner-intro .ps-cell {
    height: 110px;
  }
  .FormCompletionPage .banner-hero .banner-image {
    height: 250px;
  }
}
@media (max-width: 767px) {
  .SignUpPage .layout .content {
    padding: 30px;
    box-sizing: border-box;
  }
  .SignUpPage .layout .form-wrap form#Form_Form fieldset .field.email, .SignUpPage .layout .form-wrap form#Form_Form fieldset .field.date, .SignUpPage .layout .form-wrap form#Form_Form fieldset .field.text {
    width: 100%;
  }
  .SignUpPage footer {
    background-color: #e01a27;
    background-image: -ms-linear-gradient(top, #ed1c2a, #ce1824);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ed1c2a), to(#ce1824));
    background-image: -webkit-linear-gradient(top, #ed1c2a, #ce1824);
    background-image: -o-linear-gradient(top, #ed1c2a, #ce1824);
    background-image: -moz-linear-gradient(top, #ed1c2a, #ce1824);
    background-image: linear-gradient(top, #ed1c2a, #ce1824);
    background-repeat: repeat-x;
  }

  .FormCompletionPage .bg.container, .FormCompletionPage .container.layout {
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }
  .FormCompletionPage .bg.container .content, .FormCompletionPage .container.layout .content {
    padding: 0 20px;
  }
  .FormCompletionPage .banner-hero .row-fluid, .FormCompletionPage .banner-hero .row-fluid [class*="span"] {
    width: 100%;
  }
  .FormCompletionPage .banner-hero .row-fluid .span4, .FormCompletionPage .banner-hero .row-fluid .span8 {
    width: 100%;
  }
  .FormCompletionPage .banner-hero .row-fluid .span8 {
    display: none;
  }
  .FormCompletionPage .banner-hero .bannr-intro {
    height: auto;
  }
  .FormCompletionPage .banner-hero .bannr-intro .intro-inner {
    height: auto;
    padding: 30px 50px;
  }
  .FormCompletionPage .banner-hero .bannr-intro .ps-table, .FormCompletionPage .banner-hero .bannr-intro .ps-cell {
    height: auto;
    display: block;
  }
  .FormCompletionPage .banner-hero .banner-image {
    display: none;
  }
}
#IE8 .banner-hero, #IE9 .banner-hero {
  margin-bottom: 20px;
}
#IE8 .banner-hero .banner-intro .intro-inner, #IE9 .banner-hero .banner-intro .intro-inner {
  padding: 30px 50px;
}
#IE8 .banner-hero .row-fluid, #IE8 .banner-hero .row-fluid [class*="span"], #IE9 .banner-hero .row-fluid, #IE9 .banner-hero .row-fluid [class*="span"] {
  margin: 0px;
}
#IE8 .banner-hero .row-fluid .span4, #IE8 .banner-hero .row-fluid .span8, #IE8 .banner-hero .row-fluid [class*="span"] .span4, #IE8 .banner-hero .row-fluid [class*="span"] .span8, #IE9 .banner-hero .row-fluid .span4, #IE9 .banner-hero .row-fluid .span8, #IE9 .banner-hero .row-fluid [class*="span"] .span4, #IE9 .banner-hero .row-fluid [class*="span"] .span8 {
  margin: 0px;
}
#IE8 .banner-hero .row-fluid .span4, #IE8 .banner-hero .row-fluid [class*="span"] .span4, #IE9 .banner-hero .row-fluid .span4, #IE9 .banner-hero .row-fluid [class*="span"] .span4 {
  width: 33%;
}