@charset "UTF-8";
/* eFlow Main stylings  */
.sprites-sprite, #footer ul.socialMedia a.twitter, #footer ul.socialMedia a.facebook, #lang span.icon, #logo a, .elasCarHolder .navHolder nav span, .elasCarHolder .navHolder nav span.elastislide-next, .touch .elasCarHolder .navHolder nav span, .touch .elasCarHolder .navHolder nav span.elastislide-next, #faqBox button.search, #notice_box .alertIcon, #weatherAndTravel .weather .weatherIcon, #weatherAndTravel .weather .tempIcon, #weatherAndTravel .weather .windIcon, #registration #notSure .video .img, #registration #notSure .tag .img, .infoBox .icon, #formHolder .password-strength .triangle, #formHolder .weak-password .triangle, #formHolder .medium-password .triangle, #formHolder .strong-password .triangle, .lt-ie9 #formHolder .helpToggleIcon, .lt-ie9 #formHolder .error, .lt-ie9 #formHolder .userName .error, .lt-ie9 #formHolder .optional, .journeyBox .print, #paymentSummary span.menuButton, .lt-ie9 .deleteButton, .menuButton.deleteButton, .alertBox.green .icon, .alertBox.red .icon, span.deleteButton, #dashboard .dashboardContent .header.Video .icon, #dashboard .dashboardContent .header.Tag .icon, #dashboard .dashboardContent .businessTag .header .icon, .calcBars, #resultBoxHolders .resultBox.video .head, #resultBoxHolders .resultBox.tag .head, #twitterFeed .followUs .twitterBirdCon, #closeLogin {
  background: url("../../images/sprites-s16dcbdcdb3.png") no-repeat;
}

.greyButton, input.greyButton, button.greyButton {
  text-decoration: none !important;
  display: inline-block;
  text-shadow: 0 1px white;
  text-align: center;
  padding: 5px 15px;
  color: #2badd7;
  border: 1px solid #e5ecf1;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-decoration: none !important;
  background: #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #f4fbfd));
  background: -webkit-linear-gradient(top, white 0%, #f4fbfd 100%);
  background: -webkit-linear-gradient(top, #ffffff 0%, #f4fbfd 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #f4fbfd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4fbfd',GradientType=0 );
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.greyButton:hover, input.greyButton:hover, button.greyButton:hover {
  background: #f4fbfd;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4fbfd), color-stop(100%, white));
  background: -webkit-linear-gradient(top, #f4fbfd 0%, white 100%);
  background: -webkit-linear-gradient(top, #f4fbfd 0%, #ffffff 100%);
  background: linear-gradient(to bottom, #f4fbfd 0%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4fbfd', endColorstr='#ffffff',GradientType=0 );
}

.yellowButton a, input.yellowButton, .yellowButton {
  text-decoration: none !important;
  display: inline-block;
  font-size: 16px;
  text-align: center;
  padding: 5px 20px;
  color: #00325a !important;
  box-sizing: border-box;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  border: 1px solid #c8a613 !important;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background: #fcd31b;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcd31b), color-stop(100%, #e7c609));
  background: -webkit-linear-gradient(top, #fcd31b 0%, #e7c609 100%);
  background: linear-gradient(to bottom, #fcd31b 0%, #e7c609 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcd31b', endColorstr='#e7c609',GradientType=0 );
  /*@include boxShadow*/
}

.yellowButton a:hover, input.yellowButton:hover, .yellowButton:hover {
  background: #e7c609;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e7c609), color-stop(100%, #fcd31b));
  background: -webkit-linear-gradient(top, #e7c609 0%, #fcd31b 100%);
  background: linear-gradient(to bottom, #e7c609 0%, #fcd31b 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7c609', endColorstr='#fcd31b',GradientType=0 );
}

.blueButton a, input.blueButton, .blueButton {
  text-decoration: none !important;
  display: inline-block;
  font-size: 16px;
  text-align: center;
  padding: 20px;
  color: #2badd7 !important;
  box-sizing: border-box;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  border: 3px solid #2badd7 !important;
  font-weight: 600;
  /* border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; */
  background: #F6FBFE;
}

.blueButton a:hover, input.blueButton:hover, .blueButton:hover {
  background: #E5EAEC;
}

a.navyButton, .navyButton a, input.navyButton, button.navyButton {
  line-height: 20px;
  text-decoration: none !important;
  text-align: center;
  padding: 6px 20px 7px;
  color: #FFFFFF;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background-color: #003661;
  border: none;
}

a.navyButton:hover, .navyButton a:hover, input.navyButton:hover, button.navyButton:hover {
  background-color: #07487b;
}

.inactiveButton a, input.inactiveButton, .inactiveButton a:hover, input.inactiveButton:hover {
  text-align: center;
  padding: 10px;
  color: #cacaca !important;
  border: 1px solid #c8a613;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-decoration: none !important;
  display: inline-block;
  text-shadow: 0 1px white;
  text-align: center;
  padding: 5px 15px;
  color: #2badd7;
  border: 1px solid #e5ecf1;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-decoration: none !important;
  background: #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #f4fbfd));
  background: -webkit-linear-gradient(top, white 0%, #f4fbfd 100%);
  background: -webkit-linear-gradient(top, #ffffff 0%, #f4fbfd 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #f4fbfd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4fbfd',GradientType=0 );
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.workingButton a, input.workingButton, .workingButton a:hover, input.workingButton:hover {
  text-align: center;
  padding: 10px;
  color: #cacaca !important;
  border: 1px solid #c8a613;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-decoration: none !important;
  display: inline-block;
  text-shadow: 0 1px white;
  text-align: center;
  padding: 5px 15px;
  color: #2badd7;
  border: 1px solid #e5ecf1;
  font-weight: 600;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-decoration: none !important;
  background: #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #f4fbfd));
  background: -webkit-linear-gradient(top, white 0%, #f4fbfd 100%);
  background: -webkit-linear-gradient(top, #ffffff 0%, #f4fbfd 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #f4fbfd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4fbfd',GradientType=0 );
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  cursor: progress;
}

.yellowButton.bigPad a, input.yellowButton.bigPad, .yellowButton.bigPad,
.blueButton.smPad a, input.blueButton.smPad, .blueButton.smPad,
.navyButton.bigPad a, input.navyButton.bigPad, .navyButton.bigPad, button.navyButton.bigPad {
  padding: 12px 20px;
}

.blueButton.smPad {
  border: 1px solid #2badd7 !important;
  border-radius: 3px;
}

@media (max-width: 479px) {
  .yellowButton a, input.yellowButton, .yellowButton,
  .navyButton.bigPad a, input.navyButton.bigPad, .navyButton.bigPad, button.navyButton.bigPad {
    font-size: 14px;
  }
  .yellowButton.bigPad a, input.yellowButton.bigPad, .yellowButton.bigPad,
  .navyButton.bigPad a, input.navyButton.bigPad, .navyButton.bigPad, button.navyButton.bigPad,
  .blueButton.smPad a, input.blueButton.smPad, .blueButton.smPad {
    padding: 12px 8%;
    height: 47px !important;
  }
}

.blueButton.bigPad a, input.blueButton.bigPad, .blueButton.bigPad {
  padding: 26px 20px;
}

@media (max-width: 479px) {
  .blueButton a, input.blueButton, .blueButton {
    font-size: 14px;
  }
  .blueButton.bigPad a, input.blueButton.bigPad, .blueButton.bigPad {
    padding: 22px 8%;
  }
}

body {
  display: block;
  padding: 0 0 0;
  background: url(../../images/generic/body-bg.png);
}

a {
  color: #2badd7;
  cursor: pointer !important;
  outline: 0;
}

a:hover {
  text-decoration: underline;
}

p {
  color: #688092;
}

body * {
  font-family: "myriad-pro-n4", "myriad-pro", Arial, Helvetica, sans-serif;
}

strong {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.db {
  color: #00325a !important;
}

.lb {
  color: #2badd7 !important;
}

.red {
  color: #d35757 !important;
}

h1, h2 {
  font-weight: 300;
  font-style: normal;
  color: #00325a;
}

h2.small {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  margin: 0 0 10px 0;
  float: left;
  line-height: 20px;
}

.clear {
  zoom: 1;
  width: 100%;
}

.clear:before, .clear:after {
  display: block;
  content: "";
  line-height: 0;
}

.clear:after {
  clear: both;
}

.fontSmaller {
  font-size: 12px;
  display: inline-block;
}

.center {
  text-align: center;
}

.textLeft {
  text-align: left;
}

.textRight {
  text-align: right;
}

.noFloat {
  float: none !important;
}

.floatRight {
  float: right;
}

.floatLeft {
  float: left;
}

.marginTop {
  margin-top: 20px;
  display: inline-block;
}

.marginBottom {
  margin-bottom: 20px;
  display: inline-block;
}

.marginRight {
  margin-right: 10px;
}

.marginLeft {
  margin-left: 10px;
}

.noTop {
  margin-top: 0 !important;
}

.noBottom {
  margin-bottom: 0 !important;
}

.autoMargin {
  margin: 0 auto;
}

.fullWidth {
  width: 100% !important;
}

.minusTop {
  margin-top: -20px !important;
}

.lt-ie8 input[type=submit], .lt-ie8 input[type=reset], .lt-ie8 input[type=button] {
  -webkit-filter: chroma(color=black);
  filter: chroma(color=black);
  color: #010101;
}

.lt-ie8 .clear {
  /*width: auto;*/
  clear: both;
  zoom: 0;
  margin-top: -20px;
}

/* .lt-ie8 .headText h1 { margin-bottom: -60px;} */
/* Default Stylings */
blockquote {
  font-style: italic;
}

.floatLeft img, img.floatLeft {
  margin: 5px 10px 10px 0;
}

.floatRight img, img.floatRight {
  margin: 5px 0 10px 10px;
}

p {
  font-size: 14px;
  line-height: 20px;
}

ul, ol, p, dl dt {
  color: #688092;
}

td {
  color: #00325a;
}

.thead td {
  color: #688092 !important;
}

h1, h2, h3, h4, h5 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  color: #00325a;
}

h1, h2 {
  line-height: 40px;
}

h3, h4 {
  line-height: 30px;
}

h5 {
  line-height: 20px;
}

h1.bold, h2.bold, h3.bold, h4.bold, h5.bold {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
}

h1.light, h2.light, h3.light, h4.light, h5.light, span.headingLight {
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 300;
}

.caption {
  text-align: center;
  color: #688092;
}

h2 {
  font-size: 24.5px;
}

#traffic {
  width: 100%;
  background: url(../../images/generic/Traffic.png) repeat-x;
  height: 41px;
  margin-top: 50px;
  z-index: 1;
  position: relative;
}

#footer {
  width: 100%;
  background-color: #01385F;
  text-align: center;
  padding: 30px 0 50px;
  color: #8C9FB1;
}

#footer ul {
  margin-left: 0;
}

#footer ul li {
  display: inline;
}

#footer ul.homelinks:first-child {
  border-top: none;
}

#footer ul.homelinks {
  text-transform: uppercase;
  margin-bottom: 20px;
}

#footer ul.homelinks li {
  margin: 0;
  border-right: 1px solid #8c9fb1;
  padding: 0 40px;
}

#footer ul.homelinks li a {
  color: #8C9FB1;
}

#footer ul.homelinks .last {
  border-right: none;
}

#footer ul.socialMedia {
  margin: 20px 0;
  text-align: center;
}

#footer ul.socialMedia li {
  margin: 0 30px;
}

#footer ul.socialMedia a {
  display: inline-block;
}

#footer ul.socialMedia a.twitter {
  background-position: 0 -1196px;
  width: 130px;
  height: 30px;
}

#footer ul.socialMedia a.facebook {
  background-position: 0 -997px;
  width: 130px;
  height: 30px;
}

#footer ul.sublinks li {
  margin: 0 10px 0 0;
  border-right: 1px solid #8c9fb1;
  padding: 0 10px 0 0;
  font-size: 12px;
}

#footer ul.sublinks li a {
  color: #8C9FB1;
}

.touch #footer ul.sublinks li a {
  padding: 20px 0;
}

#footer ul.sublinks .last {
  border-right: none;
}

#footer .text p {
  margin-bottom: 3px;
  font-size: 12px;
  color: #7fa1bb;
}

#footer .factoryFooter p {
  font-size: 11px;
}

#webfactoryLogo {
  background: url("/site-files/images/generic/powered-by-emovis.png") no-repeat;
  width: 117px;
  height: 15px;
  display: block;
  margin: 0 auto;
}

#homepage_body {
  padding: 0 20px;
  overflow: hidden;
}

/*########################*/
#loginBar #formHolder {
  width: 65%;
  float: left;
  margin: 10px 0 -5px;
}

#loginBar {
  width: 100%;
  background: #00325A;
  position: absolute;
  top: 0;
  padding-bottom: 5px;
}

#loginBar .rememberMeHere {
  float: left;
  margin-top: -10px;
}

#loginBar .rememberMeHere input[type=checkbox] {
  margin: 0 10px 0 0;
}

#loginBar .rememberMeHere label {
  color: #688092;
  display: inline-block;
  margin-top: 5px;
}

#loginBar .formFields {
  width: 930px;
  margin: 0 auto;
}

#loginBar .formFields #formHolder {
  padding: 0;
}

#loginBar .formFields .formElement {
  width: 40%;
  margin-right: 10px;
}

#loginBar .formFields .formElement.small {
  width: 80px !important;
  margin-right: 0;
  float: right;
}

#loginBar .formFields .formElement label {
  color: #8C9FB1;
  width: auto;
}

#loginBar .formFields .forgotLogin {
  float: right;
  display: block;
  margin: -5px 0 -9px 0;
  padding-bottom: 10px;
}

#loginBar .formFields .forgotLogin a {
  color: #8C9FB1;
}

#loginBar .formFields input[type=submit] {
  border-radius: 3px !important;
  -moz-border-radius: 3px !important;
  -webkit-border-radius: 3px !important;
  width: 100% !important;
}

#loginBar .formFields input[type=text], #loginBar .formFields input[type=password] {
  width: 95% !important;
}

#loginBar .formFields input[type=submit] {
  float: left;
  display: block;
}

#closeLogin {
  float: left;
  text-indent: -999999px;
  background-position: 0 -1226px;
  width: 17px;
  height: 17px;
  display: block;
  margin: 5px 0 0 20px;
  cursor: pointer;
}

#loginBar .webEnableLogin {
  background: #012E4D;
  border-right: 1px solid black;
  border-left: 1px solid black;
  width: 30%;
  display: block;
  float: right;
  padding: 10px 10px 5px;
}

#loginBar .webEnableLogin span {
  display: block;
  margin-bottom: 10px;
}

#loginBar .webEnableLogin a .headingLight {
  text-decoration: none !important;
  font-size: 25px;
  margin-top: 10px;
  display: inline-block;
}

#loginBar .webEnableLogin a:hover {
  color: #8C9FB1 !important;
}

#loginBar .webEnableLogin a .p {
  color: #688092;
}

@media (max-width: 979px) {
  #loginBar .formFields {
    width: 70%;
  }
  #loginBar .formFields .formElement {
    width: 70% !important;
    margin-right: 10px;
  }
  #loginBar .formFields .formElement input {
    width: 60%;
  }
  #loginBar .formFields .formElement label {
    width: 65px !important;
  }
}

@media (max-width: 767px) {
  #loginBar {
    margin-bottom: 20px;
  }
  #loginBar .formFields #formHolder {
    width: 100%;
  }
  #loginBar .webEnableLogin {
    width: 100%;
    float: none;
  }
  #loginBar .formFields .formElement.small {
    width: 90% !important;
    float: none;
  }
  #loginBar .rememberMeHere {
    float: none;
    margin-left: 20px;
  }
  #loginBar .rememberMeHere input[type=checkbox] {
    width: 20px;
  }
  #loginBar .formFields .forgotLogin {
    margin: 10px 0 0 20px;
  }
  #loginBar {
    overflow: hidden;
  }
  #loginBar .formFields .formElement, #loginBar .formFields .forgotLogin {
    margin-left: 20px;
  }
  #loginBar .formFields {
    width: 100%  !important;
  }
  #loginBar .formFields .formElement {
    width: 90% !important;
  }
  #loginBar .formFields .formElement input {
    width: 90%;
  }
  #loginBar .formFields .formElement label {
    float: left;
  }
  #closeLogin {
    float: right;
    margin: -8px 20px 0 0;
  }
}

/*########################*/
h2.wereAbout {
  color: #00325a;
  font-size: 36px;
  margin: 25px 0;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 300;
}

.btn.btn-navbar.collapsed .close-bar {
  display: none !important;
}

#theHead {
  margin: 40px 0 20px 0;
}

#logRegHolder {
  position: relative;
}

.lt-ie8 #theHead .navyButton {
  margin-left: 10px;
  margin-right: -10px;
  padding-bottom: 6px;
  display: block;
  float: left;
}

.lt-ie8 #theHead {
  margin: 40px 0 20px 0;
}

#rsa {
  width: 100%;
  margin: 0 auto;
  background-color: #00325a;
  /* position: absolute; top: 0;  */
  padding: 2px 0;
  font-family: "myriad-pro-n4", "myriad-pro", Arial, Helvetica, sans-serif;
}

#rsa .rsa_logo {
  width: 288px;
  height: 29px;
  margin: 10px auto;
  background-position: 0 -65px;
}

#main_nav {
  float: left;
  margin-top: 20px;
  width: 560px;
  margin-left: 5px;
  margin-right: 0;
}

#main_nav > li {
  max-width: 160px;
}

#main_nav li {
  display: inline;
  margin-left: 4px;
  font-size: 16px;
}

#main_nav li a {
  color: #00325a;
  font-weight: 600;
  color: #00325a;
  font-size: 18px;
}

#main_nav li a:hover {
  color: #2badd7;
  text-decoration: none;
}

#main_nav li.open > a {
  border: 1px solid #cfe4ea;
  z-index: 9999;
  border-bottom: none;
  position: relative;
  background: #F6FBFE;
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  margin: -1px 0 -4px 0;
}

#main_nav li.open {
  margin-right: -2px;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {
  background: white !important;
  background-image: none;
  border-top: 1px solid #e5ecf1;
  border-bottom: 1px solid #e5ecf1;
  margin-top: -1px;
  margin-bottom: -1px;
}

.dropdown li {
  display: block !important;
}

.lt-ie9 #main_nav li a {
  font-size: 16px !important;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
}

.lt-ie9 #main_nav {
  float: left;
  width: 475px;
  margin-left: 20px;
}

#log_reg {
  border-left: 1px solid #b7cbda;
  float: right;
  margin: 20px 0 0 0;
  max-width: 250px;
}

#log_reg li {
  display: inline-block;
  margin-left: 15px;
  font-size: 18px;
  float: left;
}

#log_reg li a {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 15px;
  /* max-width: 90px; */
}

#log_reg a.navyButton, #log_reg .navyButton a, #log_reg input.navyButton {
  display: inline-block;
  /* padding: 6px 10px 7px;   */
  max-width: 60px;
  min-width: 40px;
}

#log_reg .avatar {
  background: url(../../images/generic/logged-in-icon.png) no-repeat scroll top left;
  display: block;
  float: left;
  height: 11px;
  margin-left: 15px;
  margin-top: 6px;
  width: 12px;
  margin-right: 5px;
}

.lt-ie8 #log_reg ul {
  float: left;
  display: inline;
}

.lt-ie8 #log_reg li {
  float: left;
  display: inline;
}

#log_reg.loggedIn {
  margin-top: 26px;
}

#log_reg.loggedIn li {
  color: #00325a;
  font-size: 13px !important;
  font-weight: 600;
}

#log_reg.loggedIn a {
  font-size: 15px;
}

#log_reg.loggedIn .username-link a {
  color: #00325A;
}

#log_reg.loggedIn .avatar {
  margin-left: 0px;
}

#lang {
  color: #688092;
  font-size: 11px;
  position: absolute;
  top: -10px;
  right: 0;
  max-width: 300px;
}

#lang span.icon {
  background-position: 0 -1542px;
  display: inline-block;
  width: 17px;
  height: 16px;
  vertical-align: middle;
}

#lang p {
  padding-left: 5px;
  display: inline-block;
}

#lang a {
  color: #7a96ae;
}

#logo {
  width: 146px;
  display: inline-block;
  height: 65px;
  float: left;
}

#logo a {
  background-position: 0 0;
  width: 146px;
  height: 65px;
  display: inline-block;
}

#logo a:hover {
  text-decoration: none;
}

.navbar {
  margin: -10px 0 10px;
}

.navbar .container {
  background: none !important;
}

.navbar-inverse .navbar-inner {
  background: none !important;
  border: none;
  width: 960px;
  margin: 0 auto;
  box-shadow: none;
}

.nav-collapse.collapse {
  float: left;
  margin-top: -4px;
}

.navbar-inverse .nav li.dropdown.open > .dropdown-toggle, .navbar-inverse .nav li.dropdown.active > .dropdown-toggle, .navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle {
  background-color: #ffffff;
}

.navbar-inverse .nav li.dropdown.open > .dropdown-toggle {
  background: none;
}

.navbar-inverse .brand, .navbar-inverse .nav > li > a {
  text-shadow: none !important;
}

.touch .dropdown-menu {
  z-index: 1000;
}

.dropdown-menu {
  border-top-left-radius: 1px;
  background: #F6FBFE;
}

.dropdown-menu li {
  display: block;
  margin-left: 0px !important;
}

.nav-collapse .nav > li > a {
  padding: 10px 10px 10px 15px;
}

.nav-collapse .dropdown-menu a {
  padding: 10px 0 10px 10px;
}

.nav-collapse .dropdown-menu li a {
  font-size: 14px !important;
  font-weight: 400;
  color: #00325a;
}

.nav-collapse .dropdown-menu li a:hover {
  color: #2badd7 !important;
}

.navbar-inverse .btn-navbar:hover, .navbar-inverse .btn-navbar:focus, .navbar-inverse .btn-navbar:active, .navbar-inverse .btn-navbar.active, .navbar-inverse .btn-navbar.disabled, .navbar-inverse .btn-navbar[disabled] {
  background: none;
}

.sky_bg_holder {
  background: url(../../images/generic/sky-bg.png);
}

#home_unit {
  background: url(../../images/generic/clouds-ie-browsers.png) repeat-x center;
  height: 475px;
  margin-top: -475px;
  /* webkit-animation: moveAcross 100s linear infinite; -moz-animation: moveAcross 100s linear infinite; -ms-animation: moveAcross 100s linear infinite; -o-animation: moveAcross 100s linear infinite; animation: moveAcross 100s linear infinite; */
  border-bottom: 1px solid #acd4e0;
}

#home_unit .container {
  padding: 20px;
  overflow: hidden;
  margin: 0 auto;
}

#home_unit .header_holder {
  width: 100%;
  text-align: center;
}

#home_unit .header_holder h1 {
  margin: 20px auto 40px;
  font-weight: 300;
  color: #00325a;
  letter-spacing: 2px;
  font-style: normal;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-size: 50px;
}

#home_unit .span3 {
  margin-right: -9px;
  margin-left: 1.6em;
}

#home_unit span.border {
  background: url(../../images/homepage/action-panel-button-divider.png);
  width: 2px;
  height: 287px;
  float: left;
  margin-left: 4px;
}

#home_unit .homepage_box {
  border: 8px solid #abd5e3;
  border-radius: 8px;
  height: 280px;
  margin-bottom: 10px;
  width: 85%;
  -webkit-box-shadow: inset 0px 8px 17px -6px #ababab;
}

#home_unit .homepage_box .content {
  background: #ffffff;
  padding: 20px 10px;
  border: 1px solid white;
  border-radius: 3px;
  height: 238px;
  text-align: center;
}

#home_unit .homepage_box .content a {
  float: left;
  margin-top: 10px;
}

#home_unit .homepage_box .content span.h2 {
  font-weight: 900;
  color: #00325a;
  font-size: 16px;
  margin: 10px 0 5px;
  display: inline-block;
}

#home_unit .homepage_box .content span.p {
  font-weight: 300;
  color: #2badd7;
  font-size: 11px;
}

#home_unit .homepage_box .content a:hover {
  text-decoration: none;
}

#home_unit .homepage_box .content span.para {
  font-style: italic;
  color: #667b8c;
  font-size: 13px;
}

#home_unit .homepage_box .content a:hover span.para {
  color: #2badd7;
}

#home_unit .homepage_box span.img {
  height: 123px;
}

#home_unit .homepage_box a.myAccount span.img {
  background: url(../../images/homepage/my-account-icon_off.png) no-repeat;
  display: inline-block;
  width: 158px;
}

#home_unit .homepage_box a.myAccount:hover span.img {
  background: url(../../images/homepage/my-account-icon_on.png) no-repeat;
}

#home_unit .homepage_box a.register span.img {
  background: url(../../images/homepage/register-icon_off.png) no-repeat;
  display: inline-block;
  width: 146px;
}

#home_unit .homepage_box a.register:hover span.img {
  background: url(../../images/homepage/register-icon_on.png) no-repeat;
}

#home_unit .homepage_box a.payToll span.img {
  background: url(../../images/homepage/pay-a-toll-icon_off.png) no-repeat;
  display: inline-block;
  width: 161px;
}

#home_unit .homepage_box a.payToll:hover span.img {
  background: url(../../images/homepage/pay-a-toll-icon_on.png) no-repeat;
}

#home_unit .homepage_box a.payPen span.img {
  background: url(../../images/homepage/pay-a-penalty_off.png) no-repeat;
  display: inline-block;
  width: 146px;
}

#home_unit .homepage_box a.payPen:hover span.img {
  background: url(../../images/homepage/pay-a-penalty_on.png) no-repeat;
}

#sky_background {
  height: 475px;
  background: url(../../images/generic/sky-bg.png) repeat-x center;
}

.elasCarHolder .navHolder {
  border-top: 1px solid #e5ecf1;
  margin-top: 30px;
}

.elasCarHolder .navHolder nav {
  width: 70px;
  margin: -12px auto 0;
}

.elasCarHolder .navHolder nav span {
  background-position: 0 -1372px;
  background-color: #ffffff;
  width: 24px;
  height: 24px;
  text-indent: -9000px;
  cursor: pointer;
  display: inline-block;
  padding-left: 10px;
}

.lt-ie8 .elasCarHolder .navHolder nav span {
  float: left;
  display: block;
}

.elasCarHolder .navHolder nav span.elastislide-next {
  background-position: 0 -1331px;
  padding-left: 0;
}

.touch .elasCarHolder .navHolder nav {
  width: 100px;
  margin: -22px auto 0;
}

.touch .elasCarHolder .navHolder nav {
  width: 100px;
  margin: -22px auto 0;
}

.touch .elasCarHolder .navHolder nav span {
  width: 44px;
  height: 44px;
  background-position: 0 -1287px;
}

.touch .elasCarHolder .navHolder nav span.elastislide-next {
  width: 44px;
  height: 44px;
  background-position: 0 -1243px;
}

.elastislide-horizontal ul li {
  float: left;
  white-space: normal;
}

.elastislide-horizontal ul {
  width: 99999px;
}

#carousel {
  -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden;
}

.hp-carousel-item {
  margin: 0 20px;
  width: 200px;
}

.elastislide-carousel ul li a img {
  border: 2px solid #cedae8 !important;
  padding: 1px;
  margin: 0 0 10px 0;
  max-height: 139px !important;
  height: 139px;
}

.hp-carousel-item img, .hp-carousel-item .p, .hp-carousel-item img, .hp-carousel-item .h3 {
  display: block;
}

.hp-carousel-item .h3 {
  display: block;
  font-weight: 600;
  color: #00223c;
  font-size: 12px;
  letter-spacing: 1px;
  line-height: 21px;
  text-transform: uppercase;
}

.hp-carousel-item .p {
  display: block;
  color: #2badd7;
  font-size: 13px;
  color: #597183;
}

.hp-carousel-item a:hover {
  text-decoration: none;
}

#faqBox {
  background: #EBF8FA;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  margin: 20px 0;
  width: 100%;
  border: 1px solid #cdd4df;
  height: 80px;
}

#faqBox form {
  float: left;
  width: 100%;
  padding: 0px 15px;
  box-sizing: border-box;
}

#faqBox input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #00325a;
}

#faqBox input:-moz-placeholder {
  /* Firefox 18- */
  color: #00325a;
  opacity: 1;
}

#faqBox input::-moz-placeholder {
  /* Firefox 19+ */
  color: #00325a;
  opacity: 1;
}

#faqBox input:-ms-input-placeholder {
  /* IE 10+ */
  color: #00325a;
}

#faqBox input:focus::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: transparent;
}

#faqBox input:focus:-moz-placeholder {
  /* Firefox 18- */
  color: transparent;
}

#faqBox input:focus::-moz-placeholder {
  /* Firefox 19+ */
  color: transparent;
}

#faqBox input:focus:-ms-input-placeholder {
  /* IE 10+ */
  color: transparent;
}

#faqBox input {
  webkit-appearance: none;
  font-weight: 300;
  border: none;
  width: 85%;
  height: 29px;
  font-size: 22px;
  color: #00325a;
  box-shadow: none;
  -webkit-transition: none;
  transition: none;
  border-color: none;
  -webkit-border-radius: none;
  -moz-border-radius: none;
  background: none;
}

#faqBox input {
  webkit-appearance: none;
  font-weight: 300;
  border: none;
  width: 90%;
  height: 29px;
  font-size: 22px;
  color: #00325a;
  box-shadow: none;
  -webkit-transition: none;
  transition: none;
  border-color: none;
  -webkit-border-radius: none;
  -moz-border-radius: none;
  background: none;
}

#faqBox input:focus {
  border-color: none;
  outline: none;
  box-shadow: none;
}

#faqBox .inputHolder {
  position: relative;
  height: 37px;
  padding: 5px 0;
  width: 95%;
  margin: 15px 0px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
  transition: border linear 0.2s, box-shadow linear 0.2s;
  border: none;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
}

#faqBox button.search {
  border: none !important;
  text-decoration: none !important;
  background-position: 0 -1520px;
  display: inline-block;
  width: 22px;
  height: 21px;
  margin: -5px 5px 0 10px;
}

.lt-ie9 #faqBox button.search {
  background-position: 0 -1521px;
}

#faqBox .explain {
  color: #00325a;
  position: absolute;
  top: 30%;
  left: 40px;
  z-index: 99999;
  font-size: 24px;
  font-weight: 300;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  line-height: 24px;
  margin-top: -2px;
  overflow: visible;
}

.lt-ie9 #faqBox input {
  line-height: 29px;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
}

#homepage_body #faqBox {
  margin-bottom: 10px;
}

.faqSearch {
  display: none;
}

.subBox {
  border: 1px solid #e5ecf1;
  border-top: none;
  width: 95%;
  height: 3px;
  position: absolute;
  bottom: -4px;
  left: 3px;
}

#notice_box {
  border: 1px solid #e5ecf1;
  width: 100%;
  float: left;
}

#notice_box .alertIcon {
  float: left;
  background-position: 0 -1424px;
  width: 35px;
  height: 29px;
  display: inline-block;
}

#notice_box .notice {
  float: left;
  width: 85%;
  margin: -20px 0 0 20px;
  padding: 10px;
}

#notice_box h3.noticeHeading {
  color: #043259;
  font-size: 14px;
  font-weight: 400;
  line-height: 15px;
}

#notice_box .lastUpdated {
  color: #a0b9cc;
  font-style: italic;
  font-size: 12px;
  line-height: 1px;
}

#notice_box .nb_content {
  padding: 10px 15px 0 15px;
  float: left;
  width: 100%;
  position: relative;
}

.lt-ie9 #notice_box .notice {
  margin: -10px 0 0 20px;
}

.homebox {
  width: 340px;
}

#twitterFeed {
  margin: 20px 0;
  float: left;
  width: 100%;
}

#twitterFeed .inner {
  width: 100%;
  -webkit-transition: all 1.0s ease-in-out;
  transition: all 1.0s ease-in-out;
}

#twitterFeed a:hover {
  color: #2badd7 !important;
}

#twitterFeed h3 {
  font-size: 14px;
  text-transform: uppercase;
  line-height: 12px;
  float: left;
  font-weight: 600;
  letter-spacing: 1px;
  width: 80%;
}

#twitterFeed .hider {
  float: right;
  margin-top: 5px;
  cursor: pointer;
  color: #688092;
  font-size: 11px;
}

#twitterFeed ul {
  margin-left: 0;
}

#twitterFeed ul li {
  list-style-type: none;
  margin-bottom: 20px;
  color: #64828F;
  font-size: 13px;
}

#twitterFeed ul li a {
  color: #2badd7;
}

#twitterFeed ul li a:hover {
  color: #00325a;
}

#twitterFeed a.homeTweetLink {
  letter-spacing: 1px;
  font-size: 11px;
}

#twitterFeed time, #fbFeed time {
  font-size: 13px;
  color: #C0C5C9;
  display: block;
  float: none;
}

.lt-ie9 #twitterFeed time, .no-cssanimations #twitterFeed time, .lt-ie9 #fbFeed time {
  display: none !important;
}

h3.m50Info {
  font-size: 14px;
  text-transform: uppercase;
  line-height: 12px;
  float: left;
  font-weight: 600;
  letter-spacing: 1px;
  width: 80%;
}

#fbFeed {
  margin-top: 20px;
}

#fbFeed h3 {
  font-size: 14px;
  text-transform: uppercase;
  line-height: 12px;
  float: left;
  font-weight: 600;
  letter-spacing: 1px;
  width: 100%;
}

#fbFeed .facebookItem {
  width: 100%;
  margin-top: 10px;
  border-bottom: 1px solid #EAF0F4;
  padding-bottom: 20px;
}

#fbFeed .facebookItem p {
  font-size: 13px;
  color: #64828F;
}

#fbFeed .facebookItem .fbImage {
  float: left;
  margin: 6px 10px 0 0;
}

#fbFeed .fbLogo {
  background-image: url(../../images/generic/facebook_logo.gif);
  display: inline-block;
  height: 28px;
  width: 28px;
  float: left;
  margin-right: 15px;
}

#fbFeed a.fbLink {
  letter-spacing: 1px;
  font-size: 11px;
}

.newsRight #twitterFeed .inner {
  background: #F6FBFE;
  border: 1px solid #eef6f8;
  position: relative;
}

.newsRight #twitterFeed ul {
  width: 90%;
  margin: 5px auto;
}

.newsRight #twitterFeed .bottom {
  border: 10px solid;
  border-color: #f6fbfe rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
  position: absolute;
  bottom: -18px;
  left: 20px;
}

.newsRight #twitterFeed .followUs {
  margin-top: 10px;
}

#twitterFeed .followUs .twitterBirdCon {
  background-position: 0 -1166px;
  display: inline-block;
  height: 23px;
  width: 32px;
  float: left;
}

#twitterFeed .followUs .follyUs, #fbFeed .follyUs {
  display: block;
  float: left;
  margin-left: 10px;
  margin-top: 5px;
}

.lt-ie9 .newsRight #twitterFeed .bottom {
  display: none;
}

#weatherAndTravel {
  margin: 20px 0;
}

#weatherAndTravel a:hover {
  color: #2badd7 !important;
}

#weatherAndTravel h3 {
  font-size: 14px;
  text-transform: uppercase;
  line-height: 12px;
  font-weight: 600;
  letter-spacing: 1px;
}

#weatherAndTravel .weather {
  float: left;
}

#weatherAndTravel .weather .weatherConditions {
  border: 1px solid #e5ecf1;
  width: 100%;
  float: left;
  padding: 7px 5px;
  max-width: 360px;
  position: relative;
}

#weatherAndTravel .weather .weatherConditions .subBox {
  width: 98%;
}

#weatherAndTravel .weather span {
  display: inline-block;
}

#weatherAndTravel .weather .text {
  vertical-align: top;
  margin-top: 4px;
  text-transform: lowercase;
}

#weatherAndTravel .weather .weather_item {
  float: left;
  margin: 0 8px;
  font-size: 12px;
  color: #00325a;
  font-weight: bold;
  font-weight: 400;
}

#weatherAndTravel .weather .icon {
  display: inline-block;
  margin-right: 5px;
}

#weatherAndTravel .weather .weatherIcon {
  width: 24px;
  height: 24px;
  background-position: 0 -1466px;
}

#weatherAndTravel .weather .tempIcon {
  width: 12px;
  height: 19px;
  background-position: 0 -1597px;
  margin-top: 6px;
}

#weatherAndTravel .weather .windIcon {
  width: 12px;
  height: 17px;
  background-position: 0 -1632px;
  margin-top: 6px;
}

#weatherAndTravel .travelTime {
  margin-top: 20px;
  float: left;
}

#weatherAndTravel .travelTime .timeBox {
  float: left;
  width: 170px;
}

#weatherAndTravel .travelTime .box {
  border: 1px solid #e5ecf1;
  float: left;
  width: 10px;
  height: 10px;
  display: inline-block;
  padding: 17px;
  color: #00325a;
  position: relative;
}

#weatherAndTravel .travelTime .box p {
  margin: -7px 0 0 -5px;
  text-align: center;
}

#weatherAndTravel .travelTime .box span.count {
  line-height: 11px;
  font-size: 20px;
}

#weatherAndTravel .travelTime .box span.time {
  font-size: 11px;
  float: left;
  line-height: 10px;
  display: inline-block;
}

#weatherAndTravel .travelTime .box .subBox {
  border: 1px solid #e5ecf1;
  border-top: none;
  width: 95%;
  height: 2px;
  position: absolute;
  bottom: -4px;
  left: 1px;
}

#weatherAndTravel .travelTime .text {
  float: left;
  margin: -5px 0 0 10px;
  width: 60%;
}

#weatherAndTravel .travelTime .text h4 {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: -6px 0 -5px -5px;
  color: #00325a;
}

#weatherAndTravel .travelTime .text p {
  color: #00325a;
  font-size: 12px;
  margin-left: -1px;
}

#weatherAndTravel .travelTime .visitNRA {
  float: left;
  margin-top: 20px;
}

#weatherAndTravel .travelTime .visitNRA a {
  font-style: italic;
  color: #45C1DB;
}

.lt-ie8 #weatherAndTravel span.time {
  line-height: 21px !important;
}

.lt-ie8 #weatherAndTravel p {
  margin-top: 8px;
}

#ourPartners {
  float: left;
}

#ourPartners h3 {
  font-size: 14px;
  text-transform: uppercase;
  line-height: 12px;
  margin-bottom: 0;
  font-weight: 600;
  letter-spacing: 1px;
}

#ourPartners .partnerBox {
  border: 1px solid #e5ecf1;
  display: inline-block;
  float: left;
  margin: 10px 0 0 10px;
  /* padding: 35px 10px 0px 15px; width: 130px; height: 55px; */
}

#ourPartners .partnerBox.left {
  margin-left: 0;
}

#home-aside {
  background: url(../../images/generic/sidebar-bg.png);
  float: left;
  padding: 5px 0 0 20px;
  background-repeat: repeat-y;
}

#home-aside .asideBox {
  margin: 10px 0;
}

#home-aside img {
  margin: 0 0 5px 0;
  padding: 1px;
  border: 1px solid #bfd0dd;
  /*max-width: 176px !important; */
  max-width: 190px !important;
}

#home-aside img.rewards {
  padding: 0;
  border: none;
}

#home-aside p {
  margin: 10px 0;
}

#home-aside h3 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  line-height: 21px;
  font-size: 17px;
  margin: 10px 0 0 0;
  color: #00223c;
  margin: 10px 0;
}

#home-aside h4 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 15px;
}

#home-aside .uppercase {
  text-transform: uppercase;
}

#home-aside .find-out-more a {
  color: #00325a;
  font-style: italic;
}

@media (max-width: 979px) {
  #rsa {
    display: none;
  }
  body {
    padding-top: 0;
  }
  #theHead {
    margin-top: 10px;
  }
  #log_reg {
    float: right;
    border: none;
    margin: 0 20px 20px 0;
  }
  #log_reg a.yellowButton, #log_reg a.navyButton {
    text-indent: 0px;
    width: auto;
    margin-top: 0px;
    height: auto;
    box-shadow: none;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  #home_unit {
    height: auto;
  }
  #home_unit .tab_clear {
    clear: left;
  }
  #home_unit a {
    width: 100%;
  }
  #home_unit .span3 {
    float: none;
    width: 100%;
  }
  #home_unit .homepage_box {
    height: 170px;
  }
  #home_unit .homepage_box .content {
    height: 128px;
  }
  #home_unit span.img, #home_unit span.h2, #home_unit span.para {
    float: left;
  }
  #home_unit span.img {
    margin: 0 0 0 20px;
    width: 160px !important;
  }
  #home_unit span.h2, #home_unit span.para {
    margin: -10px 0 0 30px !important;
  }
  #home_unit span.border {
    display: none;
  }
  .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width: 724px !important;
  }
  .navbar-inverse .navbar-inner {
    width: auto;
  }
  span.border {
    display: none;
  }
  #faqBox .explain {
    font-size: 19px;
  }
  .hp-carousel-item {
    margin: 0 40px;
  }
  .nb_content .subBox {
    width: 93.5%;
  }
  #home_unit .homepage_box {
    width: 95%;
  }
  #logRegHolder {
    float: right;
    width: 100%;
    margin-bottom: -20px;
  }
  #logRegHolder #lang {
    position: relative;
    float: right;
    margin-top: 15px;
  }
  #log_reg {
    margin: 4px 0 20px 0;
  }
  .nav-collapse.collapse {
    float: right;
  }
  #faqBox .inputHolder {
    width: 93%;
  }
  .btn.btn-navbar .close-bar {
    padding-bottom: 50px;
  }
  .navbar .btn-navbar {
    margin-top: 0;
  }
}

@media (max-width: 767px) {
  .navbar-inverse .nav-collapse .nav > li > a:hover, .navbar-inverse .nav-collapse .nav > li > a:focus, .navbar-inverse .nav-collapse .dropdown-menu a:hover, .navbar-inverse .nav-collapse .dropdown-menu a:focus {
    background: transparent !important;
  }
  .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {
    border: none;
    margin: 0 !important;
  }
  #main_nav li.dropdown > a {
    color: #ffffff;
  }
  .dropdown-menu {
    display: block !important;
  }
  .dropdown-menu li a {
    display: block;
    font-size: 16px;
  }
  .navbar-inverse .nav li.dropdown > .dropdown-toggle .caret {
    display: inline-block !important;
  }
  .btn.btn-navbar.collapsed {
    margin-bottom: -18px;
  }
  .btn.btn-navbar .icon-bar {
    display: none !important;
  }
  .btn.btn-navbar.collapsed .icon-bar {
    display: block !important;
    margin-right: 10px;
  }
  .btn.btn-navbar .close-bar {
    background: #00325a;
    color: #FFFFFF;
    padding: 10px 18px 20px;
    font-size: 20px;
    font-weight: 900;
    line-height: 20px;
  }
  .nav-collapse.collapse {
    float: left;
    background: #00325a;
    width: 100%;
    margin: 10px 0 0 0;
  }
  .dropdown li a {
    color: #2badd7 !important;
  }
  .navbar .btn-navbar {
    margin-top: 30px;
  }
  #main_nav {
    width: auto;
  }
  .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
    margin-left: 0;
    margin-right: 0;
  }
  .navbar-inverse .navbar-inner {
    width: auto;
  }
  #home_unit .header_holder {
    text-align: center;
    line-height: 65px;
  }
  #home_unit {
    height: auto;
  }
  .homebox {
    margin: 0 auto;
  }
  #home_unit a {
    width: 100%;
  }
  #home_unit .span3 {
    float: none;
    width: 100%;
  }
  #home_unit .homepage_box {
    height: 175px;
    width: 95%;
    margin-left: -20px;
  }
  #home_unit .homepage_box .content {
    height: 133px;
  }
  span.img {
    float: left;
  }
  #home-aside {
    background: none;
    margin: 0 auto;
    float: none;
    width: auto;
  }
  span.border {
    display: none;
  }
  #faqBox .explain {
    font-size: 17px;
  }
  li.open > a {
    border: none !important;
    background: none !important;
    margin: 0 !important;
  }
  .nb_content .subBox {
    width: 93.5%;
  }
  .weatherConditions .subBox {
    width: 97.5%;
  }
  #home_unit .header_holder h1 {
    line-height: 65px;
  }
  #logRegHolder {
    float: left;
    width: 102%;
    padding: 10px;
    margin: -10px -10px 0 -20px;
  }
  #log_reg {
    float: right;
    margin: 0;
  }
  #lang {
    left: 5px;
    top: 10px;
  }
  #log_reg a.register_now {
    border-left: 1px solid #e5ecf1;
    padding-left: 10px;
  }
  #log_reg li {
    margin-left: 10px;
  }
  #notice_box .notice {
    width: 80%;
  }
  #faqBox input {
    width: 85%;
  }
}

@media (max-width: 479px) {
  #home_unit {
    background: none;
  }
  #faqBox .inputHolder {
    width: 89%;
  }
  #faqBox input {
    width: 70%;
  }
  #faqBox .explain {
    display: none;
  }
  #lang {
    max-width: 160px;
  }
  #log_reg.loggedIn {
    margin-top: 0px;
  }
  h3.faqSearch {
    font-size: 32px;
    font-weight: 300;
    margin: 20px 0 -15px 0;
    display: inline-block;
    width: 100%;
  }
  #notice_box .notice {
    width: 65%;
  }
  .homebox {
    width: 100%;
  }
  #ourPartners .partnerBox {
    margin-left: 0;
  }
  li.open > a {
    border: none !important;
    background: none !important;
    margin: 0 !important;
  }
  .hp-carousel-item {
    margin: 0 20px;
  }
  h2.wereAbout {
    text-align: center;
  }
  .nb_content .subBox {
    width: 88.5%;
  }
  #home_unit {
    background: url("../../images/generic/sky-bg.png") repeat-x;
    height: 295px;
    margin-top: 0;
    width: 100%;
    padding-bottom: 20px;
  }
  #home_unit .homepage_box span.img {
    display: none !important;
  }
  #home_unit .homepage_box {
    height: 93px;
  }
  #home_unit span.para {
    display: none;
  }
  #home_unit .container {
    padding-top: 0;
  }
  #home_unit .header_holder h1 {
    letter-spacing: 0px;
    font-size: 20px;
    font-weight: 600;
    margin: 0 auto;
    line-height: 55px;
  }
  #home_unit .homepage_boxHolders {
    border: 8px solid #aacee5;
    background: white;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    float: left;
    width: 95%;
    padding: 0 0 5px;
  }
  #home_unit .homepage_box .content {
    background: none;
    height: auto;
    width: 103%;
    padding: 0;
    margin-left: 3px;
    border: none;
  }
  #home_unit .homepage_box .content a {
    border-bottom: 1px solid #cdd4df;
    margin: -1px 0 0 2px;
    padding: 0 1px 10px 5px;
  }
  #home_unit .homepage_box .content a.payPen {
    border-bottom: none;
    margin-bottom: -5px;
  }
  #home_unit .homepage_box .content a:hover {
    background: #e5ecf1;
  }
  #home_unit .homepage_box .content span.h2 {
    font-weight: 500;
    margin-top: 0;
  }
  #home_unit .homepage_box {
    border: none;
    height: auto;
    margin-left: -27px;
  }
  #home_unit .span3 {
    margin-top: -10px;
  }
  #sky_background.homer {
    background: none;
  }
  #sky_background {
    height: auto;
  }
  .hp-carousel-item {
    margin: 0 15px 0 15px;
    width: 225px;
  }
  #footer ul.homelinks li {
    margin: 0 auto;
    border-top: 1px solid #8c9fb1;
    padding: 20px 40px;
    width: 50%;
    border-right: none;
    display: block;
    list-style-type: none;
  }
  #footer ul.homelinks li.first {
    border-top: none;
  }
  #footer ul.socialMedia li {
    margin: 20px 10px;
  }
  #weatherAndTravel .weather .weatherConditions {
    width: 98%;
  }
  #lang {
    position: static;
    margin-bottom: 10px;
  }
  #lang p {
    margin: -5px 0 0;
    display: inline-block;
  }
  #home-aside {
    margin: 20px 0 0 0;
    padding: 0;
  }
}

@media (max-width: 350px) {
  #log_reg a.yellowButton, #log_reg a.navyButton {
    background: none;
    border: none;
    padding: 0;
    font-size: 14px;
    color: #2badd7;
  }
}

@media (width: 480px) {
  .touch .hp-carousel-item {
    margin: 0 20px 0 0;
  }
}

#contentContainer {
  background: white;
  padding: 0 20px;
  margin-top: 40px;
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding-bottom: 100px;
  margin-bottom: -90px;
  min-height: 500px;
}

#wrapper {
  background: url(../../images/generic/clouds-ie-browsers.png) repeat-x top;
  margin-top: -475px;
  width: 100%;
  background-position-x: -124px;
}

#registerUnit {
  padding-top: 10px;
  background: url(../../images/generic/open-account-clouds.png) no-repeat bottom;
  background-position: 0px 0px;
}

#registerUnit .content {
  width: 100%;
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

#registerTop {
  padding: 20px;
  margin: 0 auto;
}

#registerTop .text {
  margin: 0 auto;
}

#registerTop .text h1 {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
  text-align: center;
  color: #00325a;
  margin: 20px 0;
  font-size: 50px;
  line-height: 60px;
}

#registerTop .text p {
  color: #688092;
  text-align: center;
  font-size: 17px;
  width: 80%;
  margin: 0 auto 20px;
  font-weight: 300;
  line-height: 1.5;
  font-size: 20px;
}

#registerTop .text .borderline {
  text-align: center;
  border-top: 1px solid #cfe0f0;
  margin: 30px auto 0;
  height: 3px;
  display: block;
  width: 75%;
}

#registerTop .text p.boldCaps {
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 300;
  font-weight: 600;
  font-size: 17px;
  width: auto;
  text-align: center;
  color: #00325a;
  text-transform: uppercase;
  display: inline-block;
  vertical-align: top;
  margin: -13px auto -3px auto;
  background: white;
  padding: 0 10px;
}

#registerTop .outerBorder {
  border: 6px solid #e4eff5;
  display: inline-block;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
}

#registerTop .outerBorder .yellowButton {
  min-width: 170px;
}

#registerTop .buttons {
  margin: 30px auto 0;
  display: block;
  text-align: center;
}

#registerTop .buttons a {
  display: inline-block;
}

#registerTop .buttons .buttonLeft {
  margin-right: 30px;
}

#registerOptions {
  margin: 60px auto;
}

#accountBoxes .accountBox {
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background: url(../../images/generic/body-bg.png) #fdfdfd;
  border: 1px solid #ebecef;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#accountBoxes .accountBox .header {
  background: #33b6dc;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-topright: 3px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  color: #FFFFFF;
  padding: 20px 25px;
}

#accountBoxes #videoAccount .header {
  background: #063265;
}

#accountBoxes .accountBox .header .accountBox__icon {
  float: left;
  width: 56px;
  height: 56px;
}

#accountBoxes #videoAccount .header .accountBox__icon {
  background: url(../../images/generic/video-account-icon.png);
}

#accountBoxes #tagAccount .header .accountBox__icon {
  background: url(../../images/generic/tag-account-icon.png);
}

#accountBoxes .accountBox .header .accountBox__content {
  float: left;
  margin-left: 20px;
  width: 240px;
}

#accountBoxes .accountBox .header h3 {
  font-size: 30px;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  margin-top: 5px;
  margin-bottom: 0;
  line-height: 40px;
  color: #FFFFFF;
}

#accountBoxes .accountBox .header p {
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  color: #ffffff;
  line-height: 22px;
  letter-spacing: 1px;
}

#accountBoxes .accountBox .accountBox__cta {
  text-align: center;
  background: #f4fbfd;
  padding: 30px 0;
}

#accountBoxes .accountBox ul.accountList {
  margin: 20px 0;
  padding: 0px 40px;
  font-size: 14px;
}

#accountBoxes .accountBox ul.accountList li.first {
  text-transform: uppercase;
  font-weight: 600;
  padding: 0;
}

#accountBoxes .accountBox ul.accountList li {
  list-style-type: none;
  padding: 15px 0px 0px 20px;
  color: #00223c;
  position: relative;
}

#accountBoxes .accountBox ul.accountList li.first:before {
  content: '';
  left: 0px;
  margin-right: 0px;
}

#accountBoxes .accountBox ul.accountList li:before {
  content: "• ";
  margin-right: -20px;
  position: relative;
  left: -20px;
  top: 5px;
  font-size: 40px;
}

#accountBoxes .accountBox ul.accountList--tag li:before {
  color: #33b6dc;
}

#accountBoxes .accountBox ul.accountList--video li:before {
  color: #00223c;
}

#accountBoxes .accountBox:hover {
  box-shadow: 0 0 15px -3px #2badd7;
}

.lt-ie8 #registerTop .outerBorder {
  /*width: 211px;*/
  padding: 0px;
  display: inline;
}

.lt-ie9 span.borderLine {
  display: none;
}

.lt-ie9 #accountBoxes .accountBox .button-link {
  font-weight: normal !important;
}

.lt-ie9 #accountBoxes .accountBox:hover {
  border: 1px solid #2badd7;
}

.accordion__accountBoxes .accordion-group {
  position: relative;
  border: 1px solid #ebecef;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background: #33b6dc;
  box-shadow: 0 0 15px -3px #d0d0d0;
}

.accordion__accountBoxes .accordion-group .accordion-toggle {
  display: block;
  padding: 0;
}

.accordion__accountBoxes .accordion-group .accordion-toggle:hover {
  text-decoration: none;
}

.accordion__accountBoxes .accordion-group.accordion-group__account-tag {
  margin-bottom: 45px;
}

.accordion__accountBoxes .accordion-group.accordion-group__account-video {
  background: #063265;
}

.accordion__accountBoxes .accordion-group .accordion__heading {
  padding: 20px 20px 10px 20px;
}

.accordion__accountBoxes .accordion-group .accordion__heading h3 {
  color: #FFFFFF;
  margin: 0;
}

.accordion__accountBoxes .accordion-group .accordion__heading p {
  color: #FFFFFF;
  font-size: 12px;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  line-height: 18px;
  letter-spacing: 1px;
  padding-top: 5px;
}

.accordion__accountBoxes .accordion-group .accountBox__icon {
  float: left;
  width: 56px;
  height: 56px;
  margin-right: 20px;
}

.accordion__accountBoxes .accordion-group.accordion-group__account-video .accountBox__icon {
  background: url(../../images/generic/video-account-icon.png);
}

.accordion__accountBoxes .accordion-group.accordion-group__account-tag .accountBox__icon {
  background: url(../../images/generic/tag-account-icon.png);
}

.accordion__accountBoxes .accordion-group .accordion-toggle .accordion-toggle__more-information {
  height: 0px;
  background: #f4fbfd;
  box-sizing: border-box;
  -webkit-transition: height 300ms;
  transition: height 300ms;
  overflow: hidden;
}

.accordion__accountBoxes .accordion-group .accordion-toggle .accordion-toggle__more-information p {
  position: relative;
  top: 45%;
  -webkit-transform: translateY(-45%);
  transform: translateY(-45%);
  margin: 0;
  padding: 0;
  color: #35aed8;
  font-size: 16px;
  text-align: center;
}

.accordion__accountBoxes .accordion-group .accordion-toggle.collapsed .accordion-toggle__more-information {
  height: 55px;
}

.accordion__accountBoxes .accordion-group .accordion-inner {
  position: relative;
  background: #FFFFFF;
}

.accordion__accountBoxes .accordion-group .accordion__icon {
  display: block;
  position: absolute;
  bottom: -15px;
  left: 45%;
  width: 30px;
  height: 30px;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 30px 30px;
  z-index: 1;
}

.accordion__accountBoxes .accordion-group .accordion-toggle.collapsed .accordion__icon {
  background-image: url(../../images/generic/down-arrow-circle.png);
}

.accordion__accountBoxes .accordion-group .accordion-toggle .accordion__icon {
  background-image: url(../../images/generic/up-arrow-circle.png);
}

.accordion__accountBoxes .accordion-group .accordion-inner ul {
  margin: 10px 0px 30px;
  padding: 0 25px;
  font-size: 14px;
  color: #00223c;
}

.accordion__accountBoxes .accordion-group .accordion-inner ul li.first {
  text-transform: uppercase;
  font-weight: 600;
  padding: 0;
}

.accordion__accountBoxes .accordion-group .accordion-inner ul li.first:before {
  content: "";
  margin-right: 0px;
  left: 0px;
}

.accordion__accountBoxes .accordion-group .accordion-inner ul li {
  position: relative;
  list-style-type: none;
  padding: 10px 0px 0px 20px;
  color: #00223c;
}

.accordion__accountBoxes .accordion-group .accordion-inner ul li:before {
  position: relative;
  left: -20px;
  top: 5px;
  margin-right: -20px;
  content: "• ";
  position: relative;
  font-size: 40px;
}

.accordion__accountBoxes .accordion-group .accordion-inner ul.accountList--tag li:before {
  color: #33b6dc;
}

.accordion__accountBoxes .accordion-group .accordion-inner ul li.accountList--video li:before {
  color: #00223c;
}

.accordion__accountBoxes .accordion-group .accordion-inner .accountBox__cta {
  text-align: center;
  background: #f4fbfd;
  padding: 30px 0;
  margin: 0 -20px -10px -20px;
}

.accordion__accountBoxes .accordion-group .accordion-inner .accountBox__cta .accordion__icon-up {
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../../images/generic/up-arrow-circle.png);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 30px 30px;
  position: absolute;
  bottom: -30%;
  left: 45%;
}

.payToll h3 {
  font-size: 18px;
  line-height: 20px;
  text-align: left;
  color: #00325a;
  font-weight: 600;
}

.payToll p {
  font-size: 14px;
  line-height: 20px;
}

.gradHead {
  background: #f9fdfe;
  border-bottom: 1px solid #d4ecfa;
  padding: 5px 0;
  margin: 20px 0;
  float: left;
  width: 100%;
}

.gradHead .viewEdit {
  margin: 10px 20px 0 0;
}

.gradHead .divider {
  margin: 0 10px;
  color: #2badd7;
  cursor: auto;
}

.gradHead h2 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  margin: 0;
  float: left;
  margin-left: 10px;
}

.gradHead .rightButton {
  float: right;
  color: #2badd7;
  font-size: 15px;
  cursor: pointer;
  margin: 12px 10px 0 0;
}

.gradHead .rightButton:hover {
  color: #00325a;
}

.gradHead.noBg {
  background: none !important;
}

h2.gradStyle {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  margin: 0;
}

.popover {
  padding: 0;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  font-family: Georgia, "Times New Roman", Times, serif;
  border: none;
  box-shadow: none;
}

.popover .popover-content {
  font-size: 13px;
  font-weight: 500;
  font-style: italic;
  line-height: 17px;
  color: #ffffff;
  background: #03234A;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}

.gradHead.bottom {
  margin-bottom: 20px;
}

#registration .regTop h1 {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
  margin-bottom: 30px;
  text-align: center;
}

#registration .regTop p {
  color: #688092;
  font-size: 18px;
  line-height: 1.5em;
}

#registration .popover.top .arrow:after {
  border-top-color: #03234A;
}

#registration .lt-ie8 .popover {
  position: relative;
}

#registration #tagOrVideo, #registration #accountSelectButton {
  display: block;
  height: 0;
  opacity: 0;
  overflow: hidden;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

#registration #tagOrVideo.active, #registration #accountSelectButton.active {
  height: auto;
  opacity: 1;
}

#registration .boxSelect {
  margin-top: 20px;
}

#registration .boxSelect p.question {
  font-size: 15px;
  color: #00325a;
  font-weight: 400;
}

#registration .boxSelect .boxType {
  text-align: center;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  padding: 10px;
  height: 155px;
  cursor: pointer;
}

#registration .boxSelect .boxType h3 {
  margin-bottom: 10px;
  color: #00223c;
}

#registration .boxSelect .boxType p {
  font-size: 13px;
  width: 90%;
  margin: 0 auto;
  line-height: 15px;
  color: #688092;
}

#registration .boxSelect .boxType.selected {
  border: 2px solid #f3cd11;
  background: none;
}

#registration .boxSelect .boxType.gradient {
  border: 2px solid #e5ecf1;
  text-decoration: none !important;
  background: #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #f4fbfd));
  background: -webkit-linear-gradient(top, white 0%, #f4fbfd 100%);
  background: -webkit-linear-gradient(top, #ffffff 0%, #f4fbfd 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #f4fbfd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4fbfd',GradientType=0 );
}

#registration .boxSelect .boxType.gradient:hover {
  background: #f4fbfd;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4fbfd), color-stop(100%, white));
  background: -webkit-linear-gradient(top, #f4fbfd 0%, white 100%);
  background: -webkit-linear-gradient(top, #f4fbfd 0%, #ffffff 100%);
  background: linear-gradient(to bottom, #f4fbfd 0%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4fbfd', endColorstr='#ffffff',GradientType=0 );
}

#addUser p {
  text-align: center;
}

#notSure {
  background: #FAFBFE;
  margin: 40px 0 0;
  padding: 10px 0;
  display: none;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

#notSure.open {
  display: block;
}

#notSure h2 {
  font-family: "myriad-pro-n4", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-weight: 600;
  font-size: 18px;
  color: #00223c;
  margin: 0 20px;
  border-bottom: 1px solid #d0ebf8;
}

.lt-ie8 #notSure.smallSpan .span4 {
  width: 280px !important;
}

#notSure .account {
  padding: 0 20px;
}

#notSure .account h3 {
  font-size: 20px;
  text-align: center;
  margin-bottom: 0;
}

#notSure .account .img {
  display: block;
  width: 90px;
  height: 90px;
  margin: 30px auto 15px;
  float: none;
}

#notSure .account p {
  color: #688092;
  line-height: 1.5em;
}

#notSure .video .img {
  background-position: 0 -832px !important;
}

#notSure .tag .img {
  background-position: 0 -664px !important;
}

#notSure ul {
  margin-left: 15px;
  color: #688092;
}

#registerAside {
  padding-top: 20px;
  width: 85%;
  margin-left: 30px;
}

#progressBar p {
  font-size: 12px;
  text-align: right;
  margin: 0;
}

#progressBar .progress {
  height: 7px !important;
  background: #EAF6FB;
  width: 100%;
}

#progressBar .progress .bar {
  background-color: #8fc03d !important;
  background-image: none !important;
  background: #8fc03d !important;
  -webkit-filter: none;
  filter: none;
}

#stepsList {
  width: 98%;
  border: 8px solid #d9ecf1;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}

#stepsList ol {
  margin-left: 0;
  margin-bottom: -1px;
  padding: 2px 2px 1px 2px;
}

#stepsList ol li {
  padding: 10px 0;
  color: #688092;
  border-bottom: 2px solid white;
  list-style-type: none;
  font-size: 15px;
  background: #F0F9FD;
}

#stepsList ol li a {
  color: #688092;
}

#stepsList ol li span.number {
  margin: 0 10px;
}

#stepsList ol li.selected {
  background: #33B6DC;
  color: #ffffff;
}

#stepsList ol li.selected a {
  color: #ffffff !important;
}

.lt-ie9 #stepsList ol li span.number {
  font-size: 16px;
}

.lt-1e9 #progressBar .progress .bar {
  background-color: #8fc03d !important;
  background-image: none !important;
  background: #8fc03d !important;
}

.infoBox {
  position: relative;
  background: #FFFDEF;
  width: 100%;
  float: left;
  margin-bottom: 20px;
}

.infoBox .icon {
  width: 22px;
  height: 22px;
  position: absolute;
  top: 0px;
  float: left;
  background-position: 0 -1558px;
  margin: 10px 0 0 10px;
}

.infoBox .text {
  float: left;
  width: 100%;
  padding: 15px 0;
  margin: -8px 0 0 0px;
  padding-left: 45px;
  padding-right: 20px;
  box-sizing: border-box;
}

.infoBox .text p {
  padding: 0;
  color: #8F7304;
  float: left;
  text-align: left;
  margin: 5px 0 0 0;
}

.infoBox .text a {
  color: #F3C12A;
}

.infoBox .text ul {
  padding: 0;
  color: #8F7304;
  float: left;
  text-align: left;
  margin: 5px 0 0 20px;
}

.lt-ie8 .infoBox .text p, .lt-ie8 .infoBox .text ul {
  float: none;
}

#formHolder {
  margin: 20px 0;
  float: left;
  width: 100%;
}

#formHolder .formElement p {
  line-height: 27px;
}

#formHolder .formElement textarea {
  border-radius: 0px;
  width: 30%;
  float: left;
}

#formHolder .error {
  min-width: 47px;
  width: auto;
  display: inline-block;
  background: #d35757;
  float: left;
  margin: 5px 0 0 20px;
  line-height: 13px;
  padding: 0 5px 0px 5px;
  color: #FFFFFF;
  font-size: 9px;
  position: relative;
  text-transform: uppercase;
  -webkit-border-top-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomright: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

#formHolder .error:after {
  width: 10px;
  border-style: solid;
  border-width: 7px 10px 6.5px 0;
  border-color: rgba(255, 255, 255, 0) #d35757 rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
  position: absolute;
  left: -20px;
  content: "Error";
  line-height: 0;
  text-indent: -9999px;
  top: 0;
}

@media screen and (max-width: 767px) {
  #formHolder .error {
    display: none !important;
  }
}

#formHolder .optional {
  min-width: 47px;
  display: inline-block;
  background: #CDDAE2;
  float: left;
  margin: 6px 0 0 20px;
  line-height: 15px;
  padding: 0 5px;
  color: #FFFFFF;
  font-size: 10px;
  position: relative;
  text-transform: uppercase;
  -webkit-border-top-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomright: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  text-align: center;
}

#formHolder .optional:after {
  width: 10px;
  border-style: solid;
  border-width: 7.5px 10px 8px 0;
  border-color: rgba(255, 255, 255, 0) #cddae2 rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
  position: absolute;
  left: -20px;
  content: "Optional";
  line-height: 0;
  text-indent: -9999px;
  top: 0;
}

#formHolder hr {
  border-top: 1px solid #d1f0f5;
  border-bottom-color: none;
  border-left-color: none;
  border-right-color: none;
}

#formHolder .formElement {
  float: left;
  width: 100%;
  position: relative;
}

#formHolder .formElement.with-offset {
  margin-left: 145px;
}

#formHolder .formElement.with-offset label {
  float: none;
  text-align: left;
}

#formHolder .formElement label, #formHolder .formElement .labeler {
  float: left;
  text-align: right;
  margin-right: 20px;
  width: 125px;
  font-size: 15px;
  margin-top: 3px;
  color: #00325a;
}

@media screen and (max-width: 767px) {
  #formHolder .formElement label, #formHolder .formElement .labeler {
    font-size: 16px;
  }
}

#formHolder .formElement label.text-left {
  text-align: left;
}

#formHolder .formElement input.fileInput {
  margin: 4px 10px 20px 0 !important;
}

#formHolder .formElement input, #formHolder .formElement select {
  float: left;
  border-radius: 0;
  width: 55%;
}

#formHolder .formElement p.blankText {
  float: left;
  width: 55%;
}

@media screen and (max-width: 767px) {
  #formHolder .formElement p.blankText {
    width: auto;
    color: #00325a;
    font-size: 16px;
  }
}

#formHolder .formElement p.labeler {
  width: 200px;
  margin-top: 0px;
  margin-left: 0px !important;
  font-weight: 600;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

@media screen and (max-width: 767px) {
  #formHolder .formElement p.labeler {
    width: auto;
  }
}

#formHolder .formElement select {
  width: 57.3%;
}

/*#formHolder .formElement select#title { width: 181px; }*/
#formHolder .formElement input.shortInput {
  width: 40%;
}

#formHolder .formElement.form-element-error label {
  color: #d35757;
}

#formHolder .formElement.form-element-error input, #formHolder .formElement.form-element-error select, #formHolder .formElement.form-element-error textarea {
  border-color: #d35757 !important;
  color: #d35757 !important;
}

#formHolder .formElement.form-element-error option {
  float: left;
  color: red;
}

#formHolder .formElement.longLabel label {
  width: 265px !important;
}

#formHolder .formElement.longLabel input {
  width: 25% !important;
}

#formHolder .formElement.longLabel select {
  width: 35.3% !important;
}

#formHolder .formElement.mediumLabel label {
  width: 155px !important;
}

#formHolder .formElement.mediumLabel input {
  width: 33% !important;
}

#formHolder .formElement.mediumLabel select {
  width: 35.3% !important;
}

#formHolder .formElement.vehicle label, #formHolder .formElement.vehicle input {
  width: auto;
  width: auto;
}

#formHolder .formElement.vehicle input[type="submit"] {
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  float: left;
  padding: 4px 18px;
  margin: 0 0 0 10px;
}

#formHolder .formElement.vehicle select {
  width: 18%;
}

#attachment, #attachmentName {
  width: 40% !important;
}

#formHolder .clearAttachment {
  width: 18px;
  height: 17px;
  background: url("../../images/sprites-s16dcbdcdb3.png") no-repeat;
  background-position: 0 -1226px;
  cursor: pointer !important;
  margin-top: 7px;
  display: none;
  box-sizing: border-box;
}

.no-cssanimations #formHolder .clearAttachment {
  display: inline-block !important;
}

#formHolder .clearAttachment.shown {
  display: inline-block;
}

#formHolder .form-heading {
  background: #f4fbfd;
  margin: 20px -40px 30px -40px;
  padding: 2px 20px;
  position: relative;
}

#formHolder .form-heading h3 {
  font-size: 15px;
}

#formHolder .form-heading .form-tooltip {
  position: absolute;
  top: 34%;
  left: 28%;
}

#formHolder .form-heading .form-tooltip .tooltip_help {
  background: white;
  padding: 6px 14px;
  border: 1px solid #cdcdcd;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}

#formHolder .form-heading .form-tooltip .tooltip_help {
  color: #003c6b;
  font-size: 18px;
}

#formHolder .add-user {
  margin-left: 165px;
}

.yellowButton.openAccount-next, input.yellowButton.openAccount-next {
  padding: 15px 70px;
  margin-bottom: 20px;
}

.openAccount-back {
  padding: 8px 35px;
}

@media (max-width: 979px) {
  #formHolder .form-heading .form-tooltip {
    left: 10%;
  }
}

@media (max-width: 768px) {
  #formHolder .form-heading {
    margin: 30px 0;
  }
  #formHolder .form-heading .form-tooltip {
    left: 22%;
  }
}

@media (max-width: 715px) {
  #formHolder .form-heading .form-tooltip {
    left: 25%;
  }
}

@media (max-width: 600px) {
  #formHolder .form-heading .form-tooltip {
    left: 40%;
  }
}

@media (max-width: 479px) {
  #formHolder .add-user {
    margin-left: 0;
  }
}

@media (max-width: 320px) {
  #formHolder .form-heading .form-tooltip {
    left: 55%;
  }
}

.linedText {
  font-size: 120%;
  margin: 20px 0;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  z-index: 1;
}

.linedText:before {
  border-top: 1px solid #d1f0f5;
  content: "";
  margin: 0 auto;
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 95%;
  z-index: -1;
}

.linedText span {
  background: #fff;
  padding: 0 10px;
}

.formSubNote {
  color: #00325a;
  margin: 0 auto;
  width: 100%;
  text-align: center;
  display: inline-block;
}

.smells-like-honey {
  display: none !important;
}

label.paraTerms {
  width: 100% !important;
  color: #688092;
}

label.marketingTerms {
  width: 93% !important;
  color: #688092;
  text-align: left !important;
  margin: 0 0 20px 20px  !important;
}

.paymentTypeHolder {
  width: 50%;
  float: left;
  margin-bottom: 15px;
}

.currentPaymentType {
  margin-bottom: 5px;
  width: auto;
}

@media (max-width: 479px) {
  .currentPaymentType {
    float: left;
  }
}

.currentPaymentType .radioHolder input[type="radio"] {
  position: relative;
  width: 15px !important;
  z-index: 1;
}

.currentPaymentType .textHolder input[type="radio"] {
  float: right;
}

.currentPaymentType .textHolder {
  padding-left: 20px;
  text-align: left;
}

#reassignTag {
  margin-top: -20px;
}

#reassignTag .radioHolder, #reassignTag p {
  float: left;
}

#reassignTag .radioHolder input[type="radio"], #reassignTag .radioHolder label {
  display: inline-block;
}

#reassignTag .radioHolder input[type="radio"] {
  margin: -1px 0 0 10px;
}

#reassignTag .radioHolder label {
  padding-left: 20px;
}

#theVehicleToReplace {
  display: none;
}

@media (min-width: 480px) {
  /*  #theVehicleToReplace select {width: 30% !important;} */
}

@media (max-width: 479px) {
  #wrapper {
    margin-top: 0;
  }
  #formHolder .formElement textarea {
    width: 60%;
  }
  input [type="file"] {
    width: 100%;
  }
  #registerTop .text h1 {
    margin-top: -20px;
  }
  .paymentTypeHolder {
    display: block;
    width: auto;
    float: none;
    margin: 0px auto;
    text-align: left;
  }
  .paymentTypeHolder .textHolder {
    position: relative;
    top: 8px;
  }
}

#addUser button {
  padding: 4px 30px;
  font-size: 12px;
  margin-left: 145px;
  margin-top: 1px;
  cursor: pointer;
}

#addUser button[disabled] {
  cursor: not-allowed;
}

#formHolder .fineAmount {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
  color: #00325a;
  font-size: 30px;
  font-weight: 600;
  /* margin-left: 15px; */
  line-height: 24px;
  float: left;
}

.lt-ie8 #formHolder .fineAmount {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-size: 28px;
}

#formHolder .fineLabelDetails {
  width: 190px;
  display: inline-block;
  margin-right: 10px;
}

#formHolder .totalAmount {
  text-align: right;
  /* margin: 0 0 0 80px; width: 30%; */
  color: #00325a;
  float: left;
}

#formHolder .totalAmount p {
  color: #00325a;
  font-size: 12px;
  margin-right: 10px;
}

#formHolder .additionalJourneys {
  background: #FFFCF5;
  width: 100%;
  text-align: right;
  width: 90%;
  border-left: none;
  border-right: none;
  height: 0px;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#formHolder .additionalJourneys label {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-weight: 500;
  font-size: 16px;
  margin: 0 20px;
  display: inline-block;
  color: #00325a;
}

#formHolder .additionalJourneys input {
  width: 40px;
  display: inline-block;
  margin-top: 5px;
}

#formHolder .additionalJourneys p, #formHolder .additionalJourneys .fineAmount {
  display: inline-block;
  margin-bottom: 0;
  margin-right: 10px;
}

#formHolder .additionalJourneys .fineAmount {
  font-size: 22px;
}

#formHolder .popover {
  border-radius: 0;
}

#formHolder .popover .popover-title {
  background: none;
  border: none;
  color: #00325a;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 16px;
}

#formHolder .helpToggleIcon {
  float: left;
  margin: 5px 0 0 10px;
  display: inline-block;
  cursor: pointer;
  border-radius: 10px;
  border: 1px solid #d1f0f5;
  color: #00325a;
  font-weight: 600;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 18px;
  text-decoration: none;
}

#formHolder .helpToggleIcon:focus {
  border: 1px solid #000000;
  color: #000000;
}

#formHolder .weak .popover {
  border-color: #d35757;
}

#formHolder .weak .popover.right .arrow {
  border-right-color: #d35757;
}

#formHolder .inputNotice {
  float: left;
  margin-left: 10px;
  width: 100%;
}

#formHolder .inputNotice p {
  font-size: 12px;
  margin-bottom: 0;
  text-align: center;
}

#formHolder .inputNotice .message {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-style: italic;
  text-align: center;
  margin-bottom: 10px;
}

#formHolder .inputNotice .available {
  color: #00325a;
}

#formHolder .userName.taken input {
  border-color: #d35757 !important;
  color: #d35757;
}

#formHolder .userName.taken .inputNotice .message {
  color: #d35757;
}

#formHolder .password-strength {
  width: 190px;
  float: left;
  display: inline;
  font-size: 85%;
  font-weight: bold;
  border: 1px solid;
  position: absolute;
  top: 0;
  right: -19%;
  padding: 15px;
  z-index: 99999;
  background: white !important;
}

#formHolder .password-strength p {
  margin: 0;
}

#formHolder .password-strength span.pws {
  color: #00325a;
  font-size: 13px;
}

#formHolder .password-strength .triangle {
  width: 13px;
  height: 12px;
  position: absolute;
  top: 10px;
  left: -7px;
  text-indent: -9999px;
  content: " ";
  background-position: 0 -1675px;
  background-color: #FFFFFF;
}

#formHolder .password-title {
  width: 100%;
  padding: 0 0 2px 0;
}

#formHolder .password-bar {
  width: 188px;
  height: 13px;
  position: relative;
  overflow: hidden;
  border: 1px solid #cccccc;
  clear: both;
}

#formHolder .password-bar div {
  width: 0;
  height: 13px;
  float: left;
}

#formHolder .weak-password {
  background: #d35757;
}

#formHolder .weak-password .password-strength {
  border-color: #d35757;
}

#formHolder .weak-password .triangle {
  background-position: 0 -1649px;
  background-color: #FFFFFF;
}

#formHolder .medium-password {
  background: #F8931F;
}

#formHolder .medium-password .password-strength {
  border-color: #F8931F;
}

#formHolder .medium-password .triangle {
  background-position: 0 -1688px;
  background-color: #FFFFFF;
}

#formHolder .strong-password {
  background: #006830;
}

#formHolder .strong-password .password-strength {
  border-color: #006830;
}

#formHolder .strong-password .triangle {
  background-position: 0 -1662px;
  background-color: #FFFFFF;
}

#formHolder #creditCardInformation, #formHolder #directDebitInformation, #formHolder .pwStrenghtIndicator {
  display: none;
}

#formHolder #creditCardDetails {
  margin: 0px 20px;
}

@media screen and (min-width: 768px) {
  #formHolder #creditCardDetails input[type='submit'] {
    margin-left: 0px;
  }
}

@media screen and (min-width: 980px) {
  #formHolder #creditCardDetails {
    margin: 0px 100px;
  }
  #formHolder #creditCardDetails input[type='submit'] {
    margin-left: 0px;
  }
}

#formHolder #creditCardDetails .ccHelp, #formHolder #payPenalty .ccHelp {
  margin: 5px 0 0 20px;
  display: inline-block;
  cursor: pointer;
  border-radius: 10px;
  border: 1px solid #d1f0f5;
  color: #d1f0f5;
  font-weight: 600;
  width: 20px;
  height: 20px;
  text-align: center;
}

#formHolder #creditCardDetails label, #formHolder #payPenalty label {
  width: 100%;
}

@media screen and (min-width: 480px) {
  #formHolder #creditCardDetails label, #formHolder #payPenalty label {
    width: 44%;
  }
}

#formHolder #creditCardDetails input, #formHolder #payPenalty input {
  width: 30%;
}

#formHolder #creditCardDetails input[type="checkbox"], #formHolder #payPenalty input[type="checkbox"] {
  width: auto !important;
}

#formHolder #creditCardDetails select, #formHolder #payPenalty select {
  width: 32.5%;
}

@media (max-width: 479px) {
  #formHolder #creditCardDetails select, #formHolder #payPenalty select {
    width: 100% !important;
  }
}

#formHolder #creditCardDetails select.expireyDate, #formHolder #payPenalty select.expireyDate {
  width: 14.4%;
  margin-right: 20px;
}

#formHolder #creditCardDetails input.secCode, #formHolder #payPenalty input.secCode {
  width: 12.5%;
}

#formHolder #creditCardDetails input[type="submit"], #formHolder #payPenalty input[type="submit"] {
  width: auto;
}

#formHolder #creditCardDetails input[type="submit"]:focus, #formHolder #payPenalty input[type="submit"]:focus {
  border: 1px solid black;
}

#formHolder #payPenalty label {
  width: 260px;
}

#formHolder #payPenalty input {
  width: 20%;
}

#formHolder .smallElement {
  width: 40px !important;
}

.borderBottom {
  border-bottom: 1px solid #EAF6FB;
  padding-bottom: 20px;
  margin-bottom: 20px;
}

#formHolder .smallCheckBoxElement {
  width: 15px !important;
  margin-right: 20px;
}

#formHolder .get-userpass {
  float: left !important;
  display: block;
  text-align: right !important;
}

#formHolder .radio-holders {
  width: 50%;
  float: left;
  text-align: right;
}

#formHolder .buttonElement {
  float: left;
  width: 45%;
}

#formHolder .rightButtonElement {
  margin-left: 20px;
  float: left;
  width: 45%;
}

#formHolder .buttonElement label, #formHolder .rightButtonElement label {
  text-align: left !important;
}

@media (max-width: 979px) and (min-width: 480px) {
  #formHolder .radio-holders {
    width: 40%;
  }
  #formHolder .buttonElement, #formHolder .rightButtonElement {
    width: 100% !important;
  }
  #formHolder .buttonElement label, #formHolder .rightButtonElement label {
    min-width: 80px !important;
  }
  #formHolder .rightButtonElement {
    margin-left: 0px;
  }
}

@media (max-width: 479px) {
  #formHolder .get-userpass {
    float: none !important;
    text-align: left !important;
  }
  #formHolder .buttonElement, #formHolder .rightButtonElement {
    width: 100% !important;
  }
  #formHolder .buttonElement label, #formHolder .rightButtonElement label {
    width: 100px !important;
    float: left !important;
  }
  #formHolder .rightButtonElement {
    margin-left: 0px;
  }
  #formHolder .formElement.with-offset {
    margin-left: 0;
  }
}

.centreImage img {
  /*width: 400px;*/
  margin: 0 auto;
  float: none;
  display: block;
}

.payPenImg {
  position: relative;
}

.payPenImg span.payPenMag {
  display: block;
  position: absolute;
  top: 40%;
  left: 45%;
  background: url("../../images/generic/pay-a-penalty-magnifying-glass.png");
  width: 34px;
  height: 34px;
}

.lt-ie8 #formHolder .formElement {
  margin-bottom: 10px;
}

.lt-ie9 #formHolder .helpToggleIcon {
  width: 18px;
  height: 16px;
  margin: 5px 0 0 10px;
  display: inline-block;
  cursor: pointer;
  border: none;
  text-indent: -9999px;
  background-position: 0 -1490px;
}

.lt-ie9 #formHolder .error {
  width: 67px;
  height: 13px;
  display: inline-block;
  background-position: 0 -1396px;
  float: left;
  margin: 6px 0 0 20px;
  line-height: 15px;
  text-indent: -99999px;
  text-align: center;
}

.lt-ie9 #formHolder .userName .error {
  background-position: 0 -1507px;
}

.lt-ie9 #formHolder .optional {
  width: 67px;
  display: inline-block;
  background-position: 0 -1453px;
  float: left;
  margin: 6px 0 0 20px;
  text-indent: -9999px;
}

.didYouKnow {
  padding: 20px 40px;
  border: 1px solid #d1f0f5;
  float: left;
  position: relative;
  margin-bottom: 40px;
  width: 100%;
  box-sizing: border-box;
}

.didYouKnow a {
  font-family: Georgia, "Times New Roman", Times, serif;
}

.didYouKnow p {
  margin: 0;
  font-family: Georgia, "Times New Roman", Times, serif;
  color: #00325a;
  font-style: italic;
}

.didYouKnow p.normalStyle {
  font-style: normal;
}

.didYouKnow .subBox {
  border-color: #d1f0f5;
  width: 98.7%;
}

.didYouKnow .topLeft {
  position: absolute;
  top: -2px;
  left: 10px;
  width: 16px;
  height: 40px;
  background: #31BBE0;
  display: block;
}

.didYouKnow .topLeft .up {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid white;
  position: absolute;
  bottom: 0;
}

.journeyBox {
  border: 1px solid #d1f0f5;
  float: left;
  padding-bottom: 10px;
}

.journeyBox .journeyInfo, .journeyBox .penalty, .journeyBox .carImage, .journeyBox .information, .journeyBox .prosecutionNotice {
  padding: 15px 15px 0 15px;
}

.journeyBox .journeyInfo label {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  margin: 0 5px;
  float: left;
  line-height: 20px;
  max-width: 200px;
}

.journeyBox .journeyInfo p.date {
  margin-left: 20px;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
}

.journeyBox .penalty {
  text-align: right;
  font-size: 12px;
  margin-top: 15px;
  cursor: pointer;
}

.lt-ie9 .journeyBox .penalty {
  margin-top: 5px;
}

.journeyBox .penalty .fineAmount {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  color: #00325a;
  font-size: 22px;
  font-weight: 600;
}

.journeyBox .penalty p {
  display: inline;
  margin-right: 15px;
}

.journeyBox .penalty span.presser {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #00325a;
  cursor: pointer;
  float: right;
  margin-top: 10px;
}

.lt-ie8 .journeyBox .penalty span.presser {
  margin-top: -10px;
}

.journeyBox .penalty span.presser.open {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #00325a;
  border-top: none;
  display: block;
}

.journeyBox .information .db {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.journeyBox .prosecutionNotice p {
  width: 95%;
}

.journeyBox .print {
  float: right;
  background-position: 0 -1355px;
  border: none;
  text-indent: -9999px;
  width: 52px;
  height: 17px;
  display: block;
  cursor: pointer;
}

.journeyBox hr.jhr {
  margin: 10px auto;
  width: 95%;
  display: none;
  border-color: #caeaf5;
  border-top: none;
}

.journeyBox hr {
  margin: 10px auto;
  width: 95%;
  border-color: #caeaf5;
  border-top: none;
}

.journeyBox input[type="checkbox"] {
  float: left;
}

.journeyBox .row.bottom {
  height: 0;
  overflow: hidden;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  opacity: 0;
}

.journeyBox .row.bottom.open {
  height: auto;
  opacity: 1;
}

.journeyBox div.spacer {
  width: 16px;
  height: 10px;
  float: left;
}

span.status {
  padding: 2px 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 11px;
}

span.status.open {
  background: #9ac039;
}

span.status.disputed {
  background: #ffaa02;
}

span.status.prosecution {
  background: #d35757;
}

hr.jhr {
  border-color: #caeaf5;
  border-top: none;
}

#paymentSummary {
  border: 1px solid #d1f0f5;
}

#paymentSummary h2 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  margin: 0;
  float: left;
}

#paymentSummary td {
  border-top: none !important;
  border-left: none !important;
}

#paymentSummary td.last {
  border-right: none !important;
  text-align: right;
}

#paymentSummary tr {
  border-bottom: 1px solid #d1f0f5;
}

#paymentSummary .fineAmount {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
  color: #00325a;
  font-size: 30px;
  font-weight: 600;
  margin-left: 15px;
  line-height: 24px;
}

#paymentSummary .totalAmount {
  text-align: right;
  margin: 20px 15px 0 0;
  color: #00325a;
  width: 90%;
  margin: 0 auto;
}

#paymentSummary .totalAmount p {
  color: #00325a;
  font-size: 12px;
  margin-right: 0px;
}

#paymentSummary .additionalJourneys {
  background: #FFFCF5;
  width: 100%;
  text-align: right;
  width: 90%;
  border-left: none;
  border-right: none;
  height: 0px;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#paymentSummary .additionalJourneys label {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-weight: 500;
  font-size: 16px;
  margin: 0 20px;
  display: inline-block;
  color: #00325a;
}

#paymentSummary .additionalJourneys input {
  width: 70px;
  display: inline-block;
  margin-top: 5px;
  border-radius: 0px;
  moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  text-align: right;
}

#paymentSummary .additionalJourneys p, #paymentSummary .additionalJourneys .fineAmount {
  /* display: inline-block; */
  display: block;
  margin-bottom: 0;
  /*margin-right: 10px;*/
}

#paymentSummary .additionalJourneys p.smallLeft {
  font-size: 85%;
  text-align: left;
}

#paymentSummary .additionalJourneys .fineAmount {
  font-size: 22px;
}

#paymentSummary .additionalJourneys.open {
  height: auto;
  opacity: 1;
  padding: 10px;
  margin: 0 auto 20px;
  border: 1px solid #f3f3db;
}

#paymentSummary .outstandingTolls {
  background: #FFFCF5;
  width: 100%;
  text-align: right;
  border-left: none;
  border-right: none;
  height: 0px;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#paymentSummary .outstandingTolls.open {
  height: auto;
  opacity: 1;
  padding: 10px 0;
  margin: 0 auto 20px;
  border: 1px solid #f3f3db;
}

#paymentSummary .prominent {
  font-size: 14px;
  font-weight: bold;
}

#paymentSummary table.penaltyTable {
  width: 90% !important;
  margin: 20px auto;
}

#paymentSummary thead {
  color: #688092;
  border-bottom: 2px solid #cfeaf7;
  text-transform: uppercase;
  font-size: 12px;
}

#paymentSummary tr:hover {
  background-color: #fffcf3;
  color: #00325a;
}

#paymentSummary td {
  border: 1px solid #cfeaf7;
  padding: 10px;
  text-align: center;
}

#paymentSummary span.menuButton {
  float: left;
  width: 17px;
  height: 17px;
  background-position: 0 -1580px;
  cursor: pointer;
  position: relative;
  display: block;
}

#paymentSummary span.menuButton .solo {
  margin-left: 15px;
}

.subTable {
  float: left;
  margin-top: 10px;
}

.addAnother {
  background: #F8FCFF;
  text-align: center;
  width: 90%;
  margin: 0 auto 20px;
  padding: 10px 10px 0;
  border: 1px solid #d1f0f5;
  border-left: none;
  border-right: none;
}

.addAnother p {
  display: none;
}

.addAnother p a {
  cursor: pointer !important;
  font-size: 14px;
}

.additionalJourneys small {
  font-size: 100%;
}

.lt-ie9 .deleteButton {
  text-indent: -99999px !important;
  background-position: 0 -1226px;
  background-color: white !important;
}

.addAnother.closed p.closedP {
  color: #30C0E3;
  font-size: 16px;
  padding: 5px 0;
  display: block;
}

.addAnother.closed p.closedP a.plus {
  color: #ffffff;
  font-weight: 900;
  background: #30C0E3;
  border: none;
  border-radius: 20px;
  moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  font-size: 17px;
  line-height: 17px;
  width: 20px;
  display: inline-block;
  padding: 2px;
  vertical-align: top;
  cursor: pointer;
  height: 20px;
}

.addAnother.closed p.closedP a.plus:hover {
  background: #2badd7;
  text-decoration: none;
}

.addAnother.open p.openP {
  display: block;
}

.addAnother.open p.openP a {
  color: #d35757;
}

.addAnother.open p.openP a.x {
  color: white !important;
  font-weight: 600;
  background: #d35757;
  border: none;
  border-radius: 20px;
  moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  font-size: 17px;
  line-height: 20px;
  width: 20px;
  display: inline-block;
  padding: 2px;
  vertical-align: top;
  cursor: pointer;
}

.lt-ie8 .journeyBox .penalty {
  float: left;
}

.journeyBox.prosecution {
  border: 1px solid #d35757;
}

#summaryHolder .left h3 {
  color: #688092;
  line-height: 16px;
  font-size: 12px;
  letter-spacing: 1px;
  font-weight: 500;
  margin-top: 0px;
  text-transform: uppercase;
}

#summaryHolder .central {
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#summaryHolder .central .hasDropdown.open .hiddenDD {
  height: auto;
  overflow: visible;
  opacity: 1;
  display: block;
}

#summaryHolder .central .hiddenDD {
  height: 0;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#summaryHolder .central ul {
  color: #00325a;
  margin-left: 20px;
}

#summaryHolder .central p {
  display: inline-block;
  color: #00325a;
  font-weight: 400;
  margin-top: -1px;
}

#summaryHolder .central p span.grey {
  color: #688092;
  font-weight: 500;
}

#summaryHolder .central span.editDetails a {
  float: right;
  color: #2badd7;
}

#summaryHolder .central span.editDetails a:hover {
  color: #00325a;
}

#summaryHolder .central span.toggler {
  font-size: 12px;
  color: #2badd7;
  cursor: pointer;
}

#summaryHolder .central span.nameTitle {
  text-transform: capitalize;
}

#summaryHolder .termsAndConditions .terms {
  margin-bottom: 10px;
  float: left;
}

#summaryHolder .termsAndConditions .tandc {
  font-weight: bold;
  color: #D35757 !important;
  margin-top: -10px;
}

#summaryHolder .termsAndConditions .inputHolder {
  float: left;
  height: 60px;
  margin: 0 20px 0 0;
}

#summaryHolder .termsAndConditions .inputHolder2 {
  float: left;
  margin: 0 20px 20px 0;
}

.inputHolder2 input[type="checkbox"] {
  margin-right: 20px;
  margin-bottom: 10px;
}

.lt-ie9 input[type="text"]:focus {
  border: 1px solid #52a8ec;
}

.alertBox.green {
  border-color: #9ac039;
}

.alertBox.green .icon {
  background-position: 0 -754px;
  height: 78px;
}

.alertBox.red {
  border-color: #d35757;
}

.alertBox.red .icon {
  display: inline-block;
  float: none;
  margin: 0 auto 20px;
  width: 87px;
  height: 75px;
  background-position: 0 -922px;
}

.alertBox {
  width: 100%;
  border: 1px solid;
  float: left;
  margin: 20px 0 20px 0;
}

.alertBox .icon {
  width: 87px;
  height: 75px;
  display: block;
  float: left;
  margin: 0 20px 0 20px;
}

.alertBox .content {
  padding: 30px 0 !important;
  float: left;
  width: 100%;
}

.alertBox h1 {
  margin-top: -5px;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 23px;
  line-height: 30px;
  width: 100%;
}

.alertBox h2 {
  margin-top: -5px;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 19px;
  line-height: 20px;
  width: 100%;
}

.alertBox p, .alertBox h1, .alertBox h2 {
  padding: 0 20px;
  float: left;
  box-sizing: border-box;
}

.alertBox p {
  width: 100%;
}

.alertBox .text {
  float: left;
  width: 76%;
}

.alertBox.red {
  text-align: center;
}

.alertBox.red .text {
  width: 100% !important;
}

.lt-ie8 .alertBox {
  float: none;
}

.dashboardContent .alertBox {
  width: 98%;
}

.alertBox.noTop {
  margin-top: 0;
}

#alertBox {
  border: 1px solid #d35757;
  padding: 20px;
  float: left;
}

#alertBox .alertIcon {
  width: 100px;
  height: 100px;
  display: block;
  float: left;
  background: #d35757;
  margin: 0 20px 0 20px;
}

#alertBox .text {
  float: left;
  width: 80%;
}

@media (min-width: 1020px) {
  #contentContainer {
    padding: 0 40px 100px 40px;
  }
}

@media (min-width: 980px) {
  .span8 .alertBox .text {
    width: 72%;
  }
  #dashboard #menubar {
    margin-left: -38px !important;
  }
}

@media (min-width: 768px) {
  .accountBox:hover {
    -webkit-transform: scale(1.05, 1.05);
    transform: scale(1.05, 1.05);
  }
  #accountBoxes {
    margin-bottom: 50px;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  #formHolder .formElement.vehicle input[type="submit"] {
    margin: 0;
  }
  #formHolder .inputNotice {
    margin-right: 11%;
  }
  #formHolder .formElement input, #formHolder .formElement select {
    width: 40%;
  }
  #formHolder .password-strength {
    right: -22%;
  }
  #formHolder .totalAmount {
    width: 40%;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  #stepsList ol li span.number {
    margin: 0 10px 0 0 !important;
  }
  #stepsList ol li {
    padding: 5px !important;
  }
}

@media (min-width: 480px) and (max-width: 767px) {
  #formHolder .formElement input, #formHolder .formElement select {
    width: 50%;
  }
}

@media (max-width: 979px) {
  #registerTop {
    height: auto;
  }
  #registerTop .text .borderline {
    border: none;
    height: auto;
    margin: 30px auto 40px auto;
  }
  #registerTop .text p.boldCaps {
    width: 100%;
    background: none;
    display: block;
  }
  .alertBox .icon {
    float: none !important;
    margin: 0 auto 20px auto !important;
  }
  .alertBox .text {
    width: 100%;
    margin-left: 0;
  }
  .journeyBox .journeyInfo p.date {
    margin-left: 0;
  }
  #formHolder .formElement p.labeler {
    float: none;
    text-align: left;
    margin-bottom: 0px;
  }
  #formHolder .formElement p.deetLabel {
    float: left !important;
    min-height: 1px;
  }
  #formHolder .formElement p.blankText {
    width: 45%;
  }
  .get-userpass {
    float: none !important;
    text-align: left !important;
  }
  #accountBoxes .accountBox .header {
    padding: 20px 15px;
  }
  #accountBoxes .accountBox .header .accountBox__content {
    margin-left: 10px;
    width: 185px;
  }
  #accountBoxes .accountBox .header h3 {
    font-size: 28px;
    margin-top: -5px;
  }
}

@media (max-width: 767px) {
  #accountBoxes {
    margin-top: 30px;
  }
  .accountBox {
    height: auto !important;
    margin-top: 20px;
  }
  #contentContainer {
    margin-top: 0;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-topright: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
  }
  #registration .boxSelect .boxType {
    margin-top: 20px;
  }
  #registerAside {
    width: 100%;
    margin-left: 0;
  }
  .span8 .alertBox .text {
    width: 100%;
  }
  #registerTop .buttons {
    height: auto;
    width: auto;
  }
  #registerTop .buttons a, #registerTop .buttons a.buttonLeft {
    float: none;
  }
  #registerTop .buttons .outerBorder {
    width: auto;
    float: none;
    margin-right: 0;
    margin-top: 20px;
    min-width: 170px;
  }
  #formHolder .password-strength {
    position: static;
    margin: 0 0 10px 145px;
  }
  #formHolder .password-strength .triangle {
    display: none !important;
  }
  .addAnother {
    clear: both;
  }
  #formHolder .totalAmount {
    width: 100%;
    text-align: left;
  }
  p, h1, h2 {
    float: none !important;
  }
  .formSubNote {
    float: none;
  }
  #formHolder .formElement p.blankText {
    float: left !important;
  }
}

@media (min-width: 479px) and (max-width: 767px) {
  .journeyBox .span4 {
    width: auto;
    float: left;
  }
  .journeyBox .span4.right {
    width: auto;
    float: right;
  }
}

@media (max-width: 479px) {
  /*#registerTop  { margin-top: 420px; }*/
  #registerTop .buttons a, #registerTop .buttons a.buttonLeft {
    width: auto;
  }
  #registerTop .buttons {
    margin-top: 100px;
  }
  #registration .notSure h2 {
    text-align: center;
    line-height: 20px;
    margin-top: 20px;
    display: block;
    padding-top: 20px;
  }
  .gradHead h2 {
    text-align: center;
    line-height: 20px;
    display: block;
    padding-top: 10px;
  }
  #registration .regTop h1 {
    text-align: center;
    font-size: 28px;
  }
  #formHolder .formElement label, #formHolder .formElement label {
    text-align: left;
    float: none;
  }
  #formHolder .formElement input, #formHolder .formElement select {
    /*float: none;*/
    margin-left: 0 !important;
  }
  #addUser button {
    margin-left: 0 !important;
  }
  .formElement.vehicle input[type="submit"] {
    margin-left: 0 !important;
  }
  #alertBox .text {
    width: 100%;
  }
  #summaryHolder .termsAndConditions .inputHolder {
    height: 100px;
  }
  .alertBox h1, .alertBox .text {
    text-align: center;
  }
  #formHolder #creditCardDetails input:not([type='submit']) {
    width: 100%;
    height: 30px;
    box-sizing: border-box;
  }
}

@media screen and (max-width: 479px) and (min-width: 480px) {
  #formHolder #creditCardDetails input:not([type='submit']) {
    width: 60%;
  }
}

@media (max-width: 479px) {
  #formHolder #creditCardDetails select {
    width: 100%;
  }
}

@media screen and (max-width: 479px) and (min-width: 480px) {
  #formHolder #creditCardDetails select {
    width: 63.3%;
  }
}

@media (max-width: 479px) {
  #formHolder #creditCardDetails select.expireyDate {
    width: 36%;
  }
}

@media screen and (max-width: 479px) and (min-width: 480px) {
  #formHolder #creditCardDetails select.expireyDate {
    width: 28.4%;
  }
}

@media (max-width: 479px) {
  #formHolder #creditCardDetails input.secCode {
    width: 24.5%;
  }
  .journeyBox .penalty {
    text-align: left;
  }
  .journeyBox span.status {
    clear: left;
    display: inline-block;
    margin: 5px 0;
  }
  .journeyBox .journeyInfo p.date {
    margin-left: 0;
  }
  #paymentSummary tr {
    width: 100% !important;
  }
  #paymentSummary td {
    padding-top: 6px !important;
  }
  #formHolder .error {
    float: none;
  }
  #formHolder .password-strength {
    margin-left: 0;
  }
  #formHolder #payPenalty input {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  #formHolder #payPenalty input#journeyRefNo, #formHolder #payPenalty input#vehRegNo {
    height: 30px;
  }
}

@media (max-width: 479px) and (max-width: 767px) {
  #formHolder #payPenalty #vehRegNo {
    margin-bottom: 30px;
  }
}

@media (max-width: 479px) {
  #formHolder .formElement p.labeler {
    margin-left: 0 !important;
  }
  #formHolder .formElement p.blankText {
    width: 100%;
  }
}

#vehicleDetails, #statementDetails {
  float: left;
  width: 100%;
  /*margin: 20px 0;*/
  margin: 0;
}

#vehicleDetails {
  background: #FBFCFE;
  padding: 10px;
  box-sizing: border-box;
}

#vehicleDetails.vehicleDetails--myVehicles {
  background: none;
  padding: 0px;
}

#statementDetails table .tHead td {
  text-transform: uppercase;
}

.statementDetails__smartphone table .tHead td {
  text-transform: uppercase;
}

#vehicleDetails table, #statementDetails table {
  max-width: 105%;
  width: 100%;
}

#vehicleDetails tr.tHead, #vehicleDetails tr.first, #statementDetails tr.tHead, #statementDetails tr.first {
  color: #688092;
  border-bottom: 1px solid #cfeaf7;
  font-size: 11px;
}

#vehicleDetails.boldHeadTopRow tr.tHead td, #vehicleDetails.boldHeadTopRow tr.first td {
  font-size: 14px;
  font-weight: bold;
  color: white !important;
}

#vehicleDetails.boldHeadTopRow tbody td {
  color: #688092;
}

#vehicleDetails.boldHeadTopRow tr.tHead, #vehicleDetails.boldHeadTopRow tr.first {
  margin-bottom: 20px;
  text-align: center;
  min-height: 80px;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #29A9D5), color-stop(100%, #239CCA));
  background: -webkit-linear-gradient(top, #29A9D5 0%, #239CCA 100%);
  background: linear-gradient(to bottom, #29A9D5 0%, #239CCA 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#29A9D5', endColorstr='#',GradientType=0 );
}

#vehicleDetails tr:hover, #vehicleDetails td:hover tr, #statementDetails tr:hover {
  background-color: #F0F9FD;
  color: #00325a;
}

#vehicleDetails tr.tHead:hover, #vehicleDetails tr.first, #statementDetails tr.tHead:hover, #statementDetails tr.first {
  background-color: #ffffff;
  color: #688092;
}

#vehicleDetails td, #statementDetails td {
  border: 1px solid #cfeaf7;
  padding: 10px;
  text-align: center;
  max-width: 100px;
}

#vehicleDetails td.vehicleType {
  max-width: 125px;
}

#vehicleDetails td.textRight {
  text-align: right;
}

#vehicleDetails .deleteCar {
  position: relative;
}

@media screen and (max-width: 767px) {
  #vehicleDetails .deleteCar {
    margin-top: 5px;
  }
}

#vehicleDetails .deleteCar a {
  display: inline-block;
}

#vehicleDetails td.rightGrayButton .deleteCar {
  height: 33px;
  width: 100%;
}

#vehicleDetails td.rightGrayButton .deleteCar .menuButton {
  margin-top: 5px;
  cursor: pointer;
  float: right;
  display: inline-block;
  height: 28px;
  width: 28px;
  background-image: url("/site-files/images/menu_3_dots_blue.png");
  background-repeat: no-repeat;
  background-position: center;
}

#vehicleDetails td.rightGrayButton {
  padding-bottom: 10px !important;
}

#vehicleDetails td.amount {
  text-align: right;
}

#vehicleDetails td.registration {
  text-transform: uppercase;
}

#vehicleDetails thead td.visible-phone {
  font-size: 12px;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  #vehicleDetails td.dateAndTime {
    width: 200px;
  }
}

#lang ul.popUpMenu, #vehicleDetails ul.popUpMenu, ul.popUpMenu {
  text-align: left;
  opacity: 0;
  position: absolute;
  background: white;
  left: -160px;
  top: 60px;
  padding: 10px 20px 0 20px;
  margin-left: 0;
  border: 1px solid #2badd7;
  list-style-type: none;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  z-index: -1;
}

#vehicleDetails td.rightGrayButton ul.popUpMenu {
  left: -100px;
}

#vehicleDetails ul.popUpMenu {
  min-width: 150px;
}

.lt-ie8 #vehicleDetails ul.popUpMenu {
  top: -120px;
  left: -190px;
}

.lt-ie8 #vehicleDetails span.deleteButton {
  display: block;
  margin: 0;
  z-index: 0;
}

.lt-ie8 #vehicleDetails span.menuButton {
  z-index: 0;
}

ul.popUpMenu li a {
  width: 100%;
}

.lt-ie8 .headerPopup ul.popUpMenu {
  top: 0px;
  width: 100px;
  right: 40px;
}

.touch .headerPopup {
  display: none !important;
}

.pagination ul > li:last-child > a, .pagination ul > li:last-child > span, .pagination ul > li > a, .pagination ul > li > span, .pagination ul > li:first-child > a, .pagination ul > li:first-child > span {
  border-radius: 0px;
  border-color: #cfeaf7;
}

.pagination ul > li > a:hover, .pagination ul > li > a:focus, .pagination ul > .active > a, .pagination ul > .active > span {
  background-color: #F0F9FD;
}

#lang ul.popUpMenu li, #vehicleDetails ul.popUpMenu li, ul.popUpMenu li {
  margin: 0 0 10px 0;
  border-bottom: 1px solid #e3f2f7;
  padding: 5px 0;
}

#lang ul.popUpMenu li.last, #vehicleDetails ul.popUpMenu li.last, ul.popUpMenu li.last {
  border-bottom: none;
}

#lang ul.popUpMenu.open, #vehicleDetails ul.popUpMenu.open, ul.popUpMenu.open {
  opacity: 1.0;
  z-index: 99999;
  top: 30px;
}

#vehicleDetails td.rightGrayButton ul.popUpMenu.open {
  top: 10px;
}

.headerPopup ul.popUpMenu, #lang ul.popUpMenu {
  right: 0;
  left: auto;
  min-width: 100px;
}

.no-canvas #lang ul.popUpMenu, .lt-ie9 #vehicleDetails ul.popUpMenu, .lt-ie9 ul.popUpMenu {
  display: none !important;
}

.no-canvas #lang ul.popUpMenu.open, .lt-ie9 #vehicleDetails ul.popUpMenu.open, .lt-ie9 ul.popUpMenu.open {
  display: block !important;
}

#vehicleDetails .scroll {
  margin-top: 20px;
}

span.deleteButton, .menuButton.deleteButton {
  display: inline-block;
  margin: 0 auto;
  width: 18px;
  height: 17px;
  background-position: 0 -1226px;
  cursor: pointer !important;
}

span.menuButton {
  width: 17px;
  height: 17px;
  background: url(../../images/generic/cog-icon.png) no-repeat;
  cursor: pointer;
  position: relative;
  display: inline-block;
  margin-right: 10px;
}

.cardContent span.menuIcon {
  width: 17px;
  height: 17px;
  background: url(../../images/generic/cog-icon.png) no-repeat;
  cursor: pointer;
  position: relative;
  display: block;
  margin-right: 10px;
  margin-left: 5px;
  margin-top: 2px;
  float: right;
}

.headerPopup {
  position: relative;
  display: inline-block;
  float: right;
}

.headerPopup span.menuButton {
  background: none;
  max-width: 30px !important;
  width: auto;
}

.headerPopup span.menuButton.export {
  background: none;
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: relative;
  display: inline-block;
  margin-right: 10px;
}

#paymentSummary td {
  text-align: left;
}

.tableHolder table {
  margin-bottom: 40px;
}

.tableHolder table hr {
  margin: 10px 0 20px !important;
}

#vehicleDetails.lazyLoader {
  float: left;
  width: 100%;
  position: relative;
}

.lt-ie9 ul.popUpMenu {
  display: none;
}

.lt-ie9 ul.popUpMenu.open {
  display: block;
}

@media (max-width: 767px) {
  #add-vehicle-div input[name="plate_number"] {
    width: 100% !important;
    box-sizing: border-box;
    height: 30px;
  }
  #add-vehicle-div .cancel-link.blueButton.smPad.width50 {
    margin-top: 10px;
  }
  #addVehicleManually input:not([type="submit"]), #addVehicleManually select {
    height: 30px;
    width: 100% !important;
    box-sizing: border-box;
  }
  #addVehicleManually input[type="submit"] {
    margin-top: 20px;
  }
  #addVehicleManually .formElement.with-offset {
    margin-left: 0px;
  }
  #addVehicleManually label {
    text-align: left !important;
  }
  #vehicleDetails {
    margin-top: 20px;
    padding: 0px;
    background: white;
  }
  #vehicleDetails.vehicleDetails--myVehicles {
    margin-top: 0px;
  }
  #vehicleDetails.vehicleDetails--myVehicles .no-bottom-margin {
    border-bottom: none !important;
  }
  #vehicleDetails.vehicleDetails--myVehicles thead tr {
    border: none !important;
  }
  #vehicleDetails.vehicleDetails--myVehicles tbody tr {
    margin-bottom: 20px;
    padding: 0px;
    border: 1px solid #cccccc;
  }
  #vehicleDetails.vehicleDetails--myVehicles tbody td {
    width: 100% !important;
    border-bottom: 1px solid #eeeeee;
    padding: 5px 30px 25px 50%;
    text-align: left;
  }
  #vehicleDetails.vehicleDetails--myVehicles tbody td.vehicle-edit .menuButton.deleteButton,
  #vehicleDetails.vehicleDetails--myVehicles tbody td.vehicle-delete .menuButton.deleteButton {
    background-position: center center;
  }
  #vehicleDetails.vehicleDetails--myVehicles tbody td.vehicle-edit-options,
  #vehicleDetails.vehicleDetails--myVehicles tbody td.vehicle-delete-options {
    padding: 0px !important;
  }
  .account-overview-summary #vehicleDetails {
    margin-top: 0px;
  }
  .navbar {
    margin: 10px 0;
  }
  .canvas #vehicleDetails table,
  .canvas #statementDetails table {
    float: left;
  }
  .canvas #vehicleDetails table,
  .canvas #vehicleDetails thead,
  #vehicleDetails tr.first,
  .canvas #vehicleDetails tbody,
  .canvas #vehicleDetails th,
  .canvas #vehicleDetails td,
  .canvas #vehicleDetails tr,
  .canvas #statementDetails table,
  .canvas #statementDetails thead,
  #statementDetails tr.first,
  .canvas #statementDetails tbody,
  .canvas #statementDetails th,
  .canvas #statementDetails td,
  .canvas #statementDetails tr {
    display: block;
  }
  .canvas #vehicleDetails td.visible-phone {
    display: inline-block !important;
    vertical-align: top;
  }
  .canvas #vehicleDetails thead td:not(.visible-phone),
  .canvas #statementDetails thead tr,
  #statementDetails tr.first {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .canvas #vehicleDetails tr,
  .canvas #statementDetails tr {
    border: 1px solid #cccccc;
    width: 100%;
    margin-bottom: 20px;
  }
  .canvas #statementDetails tr {
    padding-bottom: 10px;
  }
  .canvas #vehicleDetails td,
  .canvas #statementDetails td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eeeeee;
    position: relative;
    white-space: normal;
    text-align: left;
  }
  .canvas #statementDetails td {
    padding: 5px 30px 25px 50%;
  }
  .canvas #vehicleDetails tr {
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    margin-bottom: 0px;
    padding: 7px 0px;
  }
  .canvas #vehicleDetails tr:hover {
    background-color: white;
  }
  .canvas #vehicleDetails td {
    font-size: 16px;
  }
  .canvas #vehicleDetails td {
    display: inline-block;
    width: 50%;
    margin-right: -3px;
    box-sizing: border-box;
    max-width: none;
    border-bottom: none;
    padding: 0px;
  }
  .canvas #vehicleDetails td.description, .canvas #vehicleDetails td.amount {
    font-weight: bold;
  }
  .canvas #vehicleDetails td.post-date, .canvas #vehicleDetails td.tag-id, .canvas #vehicleDetails td.export {
    display: none;
  }
  .canvas #vehicleDetails .vehicleType,
  .canvas #statementDetails .vehicleType {
    width: auto;
  }
  .canvas #vehicleDetails td:before,
  .canvas #statementDetails td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    text-align: left;
    font-weight: bold;
  }
  /*  Label the data  */
  .canvas #vehicleDetails td:before,
  .canvas #statementDetails td:before {
    content: attr(data-title);
  }
  #lang ul.popUpMenu.open,
  #vehicleDetails ul.popUpMenu.open,
  ul.popUpMenu.open {
    left: 50%;
  }
  #vehicleDetails td.rightGrayButton ul.popUpMenu.open {
    left: -100px;
  }
  #vehicleDetails.boldHeadTopRow tr.tHead td,
  #vehicleDetails.boldHeadTopRow tr.first td {
    font-size: 11px;
    font-weight: bold;
  }
  #vehicleDetails.boldHeadTopRow {
    margin-top: -10px;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  #vehicleDetails table {
    width: 100% !important;
  }
  td {
    min-width: auto;
  }
  span.deleteButton {
    display: block;
    margin-top: 10px;
    margin-left: 0px;
  }
  span.menuButton {
    display: block;
    margin: 0 auto;
  }
  .cardContent span.menuButton {
    display: inline-block;
    margin: auto;
  }
}

@media (max-width: 479px) {
  #lang ul.popUpMenu.open, #vehicleDetails ul.popUpMenu.open, ul.popUpMenu.open {
    left: 25%;
  }
  #vehicleDetails td.rightGrayButton ul.popUpMenu.open {
    left: -100px;
  }
}

#menubar {
  background: url(../../images/generic/sidebar-shading.png) right repeat-y #f0f9fd;
  margin: 2px -2px 0 -18px;
  padding-left: 10px;
  border-top-left-radius: 6px;
  border-right: 1px solid #dfedf1;
  height: 100%;
}

#menubar .content {
  padding: 30px 0px;
  /*margin-left: -20px;*/
}

#menubar .menuItems {
  list-style-type: none;
  margin: 0;
}

#menubar .menuItems li {
  margin: 0;
  border-bottom: 1px solid #dfedf1;
  padding-right: 5px;
}

#menubar .menuItems .showMore {
  display: none;
}

#menubar .menuItems a {
  font-size: 14px;
  font-weight: 500;
  color: #BBC3C6;
  padding: 10px 0 10px 5px;
  display: inline-block;
  /*width: 100%; */
}

#menubar .menuItems a:hover {
  text-decoration: none;
}

#menubar .menuItems li.selected {
  background: #ffffff;
  border-bottom: none;
  margin: -1px -1px 1px 0;
}

#menubar .menuItems li.selected a {
  color: #00325a;
  font-weight: 400;
}

#menubar .menuItems li:hover {
  background: #ffffff;
  border-bottom: none;
  margin-right: -1px;
  margin-bottom: 1px;
}

#menubar .menuItems li:hover a {
  color: #00325a;
  font-weight: 400;
}

.dashboard__menubar--responsive #menubar {
  background: #fff;
  border: 0;
  margin-top: -5px;
  padding: 0;
  margin-left: 0;
}

.dashboard__menubar--responsive #menubar .content {
  padding: 0;
}

.dashboard__menubar--responsive #menubar .menuItems {
  text-align: inherit;
}

.dashboard__menubar--responsive #menubar .menuItems li {
  margin: 0 -5px;
  border: 1px solid #d5d7d8;
  padding: 10px 12px;
}

.dashboard__menubar--responsive #menubar .menuItems a {
  font-size: 14px;
  font-weight: 500;
  color: #688092;
  padding: 0;
  display: inline-block;
}

.dashboard__menubar--responsive #menubar .menuItems a:hover {
  text-decoration: none;
}

.dashboard__menubar--responsive #menubar .menuItems li.selected {
  background: #2badd7;
  margin: 0 -5px;
  border: 1px solid #2badd7;
}

.dashboard__menubar--responsive #menubar .menuItems li.selected a {
  color: #00325a;
  font-weight: 400;
  color: white;
}

.dashboard__menubar--responsive #menubar .menuItems li:hover {
  background: #2badd7;
  border: 1px solid #2badd7;
  margin: 0 -5px;
}

.dashboard__menubar--responsive #menubar .menuItems li:hover a {
  color: white;
  font-weight: 400;
}

.headText {
  float: left;
}

.headText h1 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  margin-top: -6px;
  margin-bottom: 0px;
  font-size: 35px;
}

.headText h2 {
  margin: 0 0 5px 10px;
  font-size: 30px;
}

.headText p {
  color: #809aad;
  margin: 5px 0px 10px 10px;
  text-transform: uppercase;
  font-size: 18px;
  line-height: 18px;
  font-weight: 300;
}

h2.headCompanyName {
  margin: 0 0 5px 0;
  font-size: 28px;
  float: right;
  max-width: 45%;
}

.headTextBlue {
  width: 100%;
  float: left;
  background: #2AA9D4;
  font-size: 30px;
  padding: 10px 0;
}

.headTextBlue h1 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-weight: 500;
  color: #ffffff;
  font-size: 20px;
  margin: 0 0 0 20px;
}

#dashboard {
  height: 100%;
}

#dashboard .dashboardContent .gradHead {
  margin-bottom: 10px;
}

#dashboard .dashboardContent .content {
  width: 100%;
  padding: 30px 0px 30px 0;
}

@media screen and (max-width: 767px) {
  #dashboard .dashboardContent .content {
    padding: 0px 0px 30px;
  }
}

#dashboard .dashboardContent .content .header .icon {
  display: inline-block;
  width: 60px;
  height: 57px;
  float: left;
}

#dashboard .dashboardContent .content .header.bordered {
  border: 1px solid #e5ecf1;
  float: left;
  width: 99.5%;
  padding: 1px;
  background: #ffffff;
}

#dashboard .dashboardContent .content .borderBox {
  border-bottom: 1px solid #dbf1ef;
  float: left;
  width: 100%;
  padding: 10px 0 5px;
}

#dashboard .dashboardContent .content .borderBox p {
  color: #00325a;
  float: left;
  line-height: 1.5em;
  max-width: 80%;
}

#dashboard .dashboardContent .content .borderBox.noBorder {
  border: none !important;
}

#dashboard .dashboardContent .content .myVehicles .borderBox, #dashboard .dashboardContent .content .accountDeets .borderBox {
  padding: 10px 0 20px 0;
}

#dashboard .dashboardContent .content .editPayments {
  margin: 30px 0 0 0;
  float: left;
}

#dashboard .dashboardContent .content span.viewEdit {
  float: right;
  position: relative;
}

#dashboard .dashboardContent .content p.reg {
  color: #00325a;
  font-size: 15px;
  margin: 0 5px 0 10px;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  display: inline-block;
  float: none;
}

#dashboard .dashboardContent .content p.deets {
  color: #688092;
  font-style: italic;
  margin: 0 0 0 10px;
  float: none;
}

#dashboard .dashboardContent .content .accountDeets .deetPiece {
  float: left;
  width: 40%;
}

#dashboard .dashboardContent .content .accountDeets .deetInfo {
  float: left;
  width: 60%;
}

#dashboard .dashboardContent .content .accountDeets .deetInfo p {
  color: #00325a;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  line-height: 21px;
}

#dashboard .dashboardContent .content .accountDeets .deetInfo a {
  font-weight: 500;
}

#dashboard .dashboardContent .content .notMine {
  font-size: 12px;
  margin: 5px 0 0 5px;
  font-size: 12px;
  display: inline-block;
}

#dashboard .dashboardContent .content .notMine a {
  color: #d35757;
  font-size: 12px;
}

#dashboard .dashboardContent .content .twoButtonHolder .greyButton, #dashboard .dashboardContent .content .twoButtonHolder .yellowButton {
  margin-left: 20px;
}

#dashboard .dashboardContent .content .twoButtonHolder .first {
  margin-left: 0;
  margin-top: -3px;
}

#dashboard .dashboardContent .header.Video .icon {
  background: url(../../images/generic/video-account-head-icon.png);
  width: 57px;
  height: 57px;
}

#dashboard .dashboardContent .header.Tag .icon {
  background-position: 0 -368px;
}

.lt-ie8 #dashboard .dashboardContent .header.Tag, .lt-ie8 #dashboard .dashboardContent .header.Tag {
  margin-bottom: 20px;
}

.dashboardContent .summaryAccountCost {
  background: #f6fbfe;
  border: 1px solid #d2f3fe;
  text-align: center;
  padding: 25px 0px 0px 0px;
  margin: 5px 0 20px 0;
  border-radius: 3px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}

.dashboardContent .summaryAccountCost .summaryAccountCost__total-amount {
  font-size: 36px;
  color: #002548;
  padding: 10px 0px 20px;
}

.dashboardContent .summaryAccountCost .summaryAccountCost__info {
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

.dashboardContent .summaryAccountCost .yellowButton {
  padding: 12px 40px;
}

.dashboardContent .summaryAccountCost .blue-color {
  color: #2badd7;
}

.dashboardContent .summaryAccountCost a.yellowButton.bigPad {
  margin-bottom: 10px;
}

.dashboardContent .summaryAccountCost a.editPaymentDetails {
  display: inline-block;
  margin-bottom: 20px;
}

.dashboardContent .summaryAccountCost .collapse {
  background: #f6fbfe;
}

.dashboardContent .summaryAccountCost .collapse.in {
  outline: 1px solid #d4ecfa;
  margin-top: -80px;
}

.dashboardContent .summaryAccountCost .collapse h2 {
  font-size: 20px;
}

.dashboardContent .summaryAccountCost .collapse .arrow-up {
  display: block;
  width: 13px;
  height: 8px;
  background-image: url("../../images/generic/arrow-up-blue.png");
  background-repeat: no-repeat;
  margin: 10px auto;
}

.dashboardContent .summaryAccountCost #MadeAPayment a:focus {
  border: none;
}

.account-overview-summary h3 {
  font-size: 15px;
  color: #688092;
  font-weight: 500;
  padding-left: 15px;
}

.account-overview-summary .table tr th {
  background: #f4fbfd;
  color: #333333;
  padding: 15px 20px;
  font-weight: 500;
}

.account-overview-summary table {
  margin-bottom: 10px;
}

.account-overview-summary .table tr td {
  border-top: 0;
  padding: 10px 20px;
}

.account-overview-summary .table tr {
  border-bottom: 1px solid #daecf2;
}

.account-overview-summary.account-overview-summary__your-account .table tr:last-child {
  border-bottom: 0;
}

.account-overview-summary .account-overview-summary__view-more-link {
  float: right;
  margin-top: -10px;
}

.account-overview-summary .account-overview-summary__view-more-link .arrow-down {
  display: block;
  float: right;
  width: 13px;
  height: 8px;
  background-image: url("../../images/generic/arrow-down-blue.png");
  background-repeat: no-repeat;
  margin-top: 7px;
  margin-left: 6px;
}

@media (max-width: 767px) {
  .account-overview-summary h3 {
    padding: 0;
  }
  .account-overview-summary .table tr th,
  .account-overview-summary .table tr td {
    padding: 8px;
    line-height: 18px;
    text-align: left;
  }
  .account-overview-summary .table tr th {
    background: transparent;
    text-transform: uppercase;
    font-size: 13px;
    color: #00325a;
  }
  .account-overview-summary.account-overview-summary__your-account h3 {
    padding: 10px 20px;
    border: 1px solid #daecf2;
    background: #f4fbfd;
    margin-top: 20px;
  }
  .account-overview-summary.account-overview-summary__your-account .table tr th {
    background: transparent;
    text-transform: uppercase;
    font-size: 13px;
    color: #00325a;
  }
}

@media (max-width: 320px) {
  .account-overview-summary .table tr th,
  .account-overview-summary .table tr td {
    padding: 6px;
    line-height: 24px;
    text-align: left;
  }
}

.faqHolderBox.active .faqContent {
  margin-top: 10px;
}

.faqHolderBox.active .bottom {
  height: auto;
  opacity: 1;
  overflow: visible;
  float: left;
}

.faqHolderBox.active .gradHead {
  margin: 0 0 20px 0;
  border-bottom: 1px solid #d4ecfa;
}

.faqHolderBox.active .gradHead h2 {
  color: #00325a;
}

.faqHolderBox {
  border: 1px solid #d1f0f5;
  margin-bottom: 20px;
  float: left;
  width: 100%;
}

.faqHolderBox .bottom {
  height: 0;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}

.faqHolderBox .bottom p {
  padding: 0 20px;
}

.faqHolderBox .gradHead {
  margin: 0 !important;
  border-bottom: none;
}

.faqHolderBox .gradHead h2 {
  color: #2badd7;
  margin-left: 20px;
  width: 80%;
  line-height: 22px;
  margin: 10px 0 10px 20px;
  cursor: pointer;
}

.faqHolderBox .viewEdit a {
  cursor: pointer !important;
}

.faqHolderBox ul {
  margin: 10px 0 0 10px;
  padding: 0 20px;
}

.faqHolderBox ul li {
  list-style-type: none;
  margin-bottom: 10px;
  font-size: 14px;
}

.faqHolderBox #faqBox {
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-left: none;
  border-right: none;
  border-bottom: none;
}

.faqHolderBox #faqBox .inputHolder {
  width: 70%;
  float: left;
}

.faqHolderBox #faqBox .rightBox {
  float: left;
  width: 22%;
  margin: 15px 0 0;
  font-size: 14px;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.faqHolderBox #faqBox .rightBox p {
  width: 90%;
  margin: 0 auto 10px;
  color: #00325a;
  line-height: 16px;
}

.faqHolderBox #faqBox .explain {
  font-size: 24px;
}

.faqHolderBox .gradHead .spanEdit {
  margin-top: 15px;
}

span.viewEdit.forFAQ {
  margin-top: 9px;
}

#faqQuestions h2 {
  border-bottom: 1px solid #eeeeee;
  width: 100%;
}

#faqQuestions .faqHolderBox h2 {
  border-bottom: none !important;
  width: auto !important;
}

/* #genericContent {padding: 20px;} */
@media (min-width: 768px) {
  #vehicleDetails.faqTable td.vType {
    max-width: 200px;
    padding-right: 30px;
    color: #597183;
  }
  #vehicleDetails.faqTable td {
    text-align: left;
    color: #00325a;
  }
  #vehicleDetails.faqTable thead td {
    font-size: 12px;
    color: #597183;
  }
  #vehicleDetails.faqTable tr.tHead {
    border-bottom: none;
  }
}

@media (max-width: 767px) {
  #vehicleDetails.faqTable td {
    font-size: 13px;
  }
  #vehicleDetails.faqTable td.vType {
    max-width: 300px;
    padding-right: 30px;
    color: #597183;
  }
  h2.headCompanyName {
    clear: both;
    max-width: 100% !important;
  }
}

@media (max-width: 767px) and (min-width: 480px) {
  #faqQuestions .faqHolderBox h2 {
    float: left !important;
    width: 85% !important;
  }
}

@media (max-width: 479px) {
  .yellowButton.doubleUp {
    margin: 10px 0 !important;
    padding: 10px 0 !important;
    width: 100% !important;
  }
  .blueButton.doubleUp {
    margin: 10px 0 !important;
    padding: 18px 0 !important;
    width: 100% !important;
  }
  .faqHolderBox span.viewEdit {
    float: none !important;
    width: 45px;
    margin: 0 auto 10px auto;
    display: block;
  }
}

.terms {
  margin-top: 20px;
  float: left;
  width: 100%;
}

.terms p {
  font-size: 12px;
}

.terms span.plus {
  margin-right: 10px;
  display: inline-block;
  margin: 5px 10px 5px 0;
}

.terms input {
  float: left;
}

.generalQueries h2 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 22px;
  float: left;
  line-height: 23px;
}

.generalQueries h3 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  line-height: 23px;
  color: #00325a;
}

.generalQueries .section {
  margin: 0 0 20px 0;
}

.generalQueries .viewEdit {
  float: right;
  margin-top: 20px;
}

.lt-ie9 .hgcomponent {
  margin-bottom: 20px;
}

.helpAndGuidance {
  border: 1px solid #dbf1ef;
  float: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

.helpAndGuidance--noborder {
  border: 0;
}

.helpAndGuidance--noborder #faqBox {
  border: 1px solid #cdd4df !important;
}

.helpAndGuidance--noborder .row, .helpAndGuidance--noborder .gradHead {
  display: none;
}

.helpAndGuidance .gradHead {
  background: none;
  border: none;
}

.helpAndGuidance .gradHead h2 {
  margin: -10px 0 -10px 30px;
}

@media screen and (max-width: 767px) {
  .helpAndGuidance .gradHead h2 {
    margin-bottom: 10px;
  }
}

.helpAndGuidance ul, .helpAndGuidance p {
  margin: 0 0 0 10px;
  padding: 0 20px;
}

.helpAndGuidance div.span5 div {
  padding: 0 30px;
}

.helpAndGuidance ul li {
  list-style-type: none;
  margin-bottom: 10px;
}

.helpAndGuidance #faqBox {
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-left: none;
  border-right: none;
  border-bottom: none;
}

.helpAndGuidance #faqBox .inputHolder {
  width: 100%;
  float: left;
}

.helpAndGuidance #faqBox .rightBox {
  float: left;
  width: 22%;
  margin: 15px 0 0;
  font-size: 14px;
  font-weight: 400;
}

.helpAndGuidance #faqBox .rightBox p {
  width: 90%;
  margin: 0 auto 10px;
  color: #00325a;
  line-height: 16px;
}

.helpAndGuidance #faqBox .explain {
  font-size: 24px;
  line-height: 27px !important;
}

.newsEntry {
  margin: 0 0 40px 0;
}

.newsEntry .date {
  position: relative;
  padding-left: 25px;
}

.newsEntry .date p {
  line-height: 9px;
  font-size: 12px;
}

.newsEntry .date .topLeft {
  position: absolute;
  top: -2px;
  left: 0;
  width: 12px;
  height: 20px;
  background: #31BBE0;
  display: block;
}

.newsEntry .date .topLeft .up {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid white;
  position: absolute;
  bottom: 0;
}

.newsEntry .newsContent {
  width: 90%;
  margin-left: 25px;
}

.newsEntry h2 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.newsEntry .image {
  margin-bottom: 20px;
}

.newsRight {
  margin-top: 84px;
}

.span4.newsRight {
  margin-top: 40px;
}

.newsRight h4 {
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 300;
  color: #00325a;
  font-size: 14px;
  margin-top: 0;
}

.newsRight .signup {
  border: 1px solid #d1f0f5;
  padding: 15px;
}

.newsRight .signup hr {
  margin: 10px 0;
}

#display-transaction-total {
  float: right;
  text-align: right;
}

#display-transaction-total ul {
  list-style: none;
}

#overMonth {
  background: #FBFCFE;
  text-align: center;
  margin: -10px 0 0px;
}

#overMonth h2.month {
  display: inline;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 25px;
}

#overMonth span.direction {
  display: inline-block;
}

#overMonth a.greyButton {
  color: black !important;
  line-height: 6px;
  padding: 3px 3px 6px 3px;
  margin: 0 0 -1px 5px;
}

#overMonth a.greyButton.left {
  margin: 0 5px -1px 0;
}

#overMonth a.left,
#overMonth a.right {
  display: inline-block;
  position: relative;
  margin-top: 10px;
  top: 10px;
  width: 18px;
  height: 31px;
  background-size: 15px auto;
  background-repeat: no-repeat;
}

#overMonth a.left:focus,
#overMonth a.right:focus {
  border: none;
}

#overMonth a.left:hover,
#overMonth a.right:hover {
  opacity: 0.8;
}

#overMonth a.left {
  margin-right: 10px;
  background-image: url("/site-files/images/blue_arrow_left.png") !important;
}

#overMonth a.right {
  margin-left: 10px;
  background-image: url("/site-files/images/blue_arrow_right.png") !important;
}

.touch .dropDowner .multiSelect {
  position: static;
}

#paymentNav {
  border-bottom: 1px solid #d1f0f5;
  margin: 30px 0 20px 0;
}

#paymentNav ul {
  margin-left: 10px;
}

#paymentNav ul li {
  display: inline;
  list-style-type: none;
  margin-right: 4px;
}

#paymentNav ul li a {
  color: #2badd7;
  background: #F0F9FD;
  padding: 11px 20px;
  border: 1px solid #d1f0f5;
  border-bottom: none;
}

#paymentNav ul li.selected a {
  color: #2badd7;
  background: white;
  padding-bottom: 12px;
}

#paymentNav span.viewEdit {
  margin: -30px 0 0 0;
}

#paymentDetails h3 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 15px;
  margin: 10px 5px 10px 0;
  line-height: 20px;
  float: left;
}

#paymentDetails .active.card {
  border: 8px solid #fafbf3;
  width: 98%;
  margin-top: 0;
}

#paymentDetails .active.card .cardContent {
  border: 1px solid #9ac039;
  padding: 5px 0;
  float: left;
  width: 100%;
}

#paymentDetails .active.card .cardContent ul.popUpMenu, #paymentDetails .card .cardContent ul.popUpMenu {
  left: -90px !important;
  top: 20px !important;
}

#paymentDetails .active.card .viewEdit {
  margin-right: 0;
  margin-top: 7px;
}

#paymentDetails .active.card .viewEdit a {
  border-right: none;
  padding-right: 0;
}

#paymentDetails .centerTop {
  text-align: center;
  margin: 20px auto;
}

#paymentDetails .card {
  border: 1px solid #d1f0f5;
  width: 100%;
  float: left;
  margin: 10px 0 0;
}

#paymentDetails .card .cardContent {
  padding: 15px 0px;
  background: #F9FDFE;
}

#paymentDetails .card .text {
  width: 95%;
  margin: 0 auto;
}

#paymentDetails .card h2 {
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 17px;
  margin: 10px 5px 0 0;
  line-height: 20px;
}

#paymentDetails .card p {
  color: #688092;
  margin-bottom: 0;
}

#paymentDetails .card p.info {
  font-size: 11px;
}

#paymentDetails .card span.deet {
  margin-left: 10px;
}

#paymentDetails .card .status {
  margin-left: 5px;
}

#paymentDetails .card .viewEdit {
  margin-right: 5px;
}

.tableDataHolder {
  margin-bottom: 20px;
}

.tableData {
  border: 1px solid #EAF0F4;
  margin-top: 20px;
  border-radius: 4px;
}

.tableData .tableDataHead {
  margin-bottom: 20px;
  text-align: center;
  min-height: 60px;
  font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #29A9D5), color-stop(100%, #239CCA));
  background: -webkit-linear-gradient(top, #29A9D5 0%, #239CCA 100%);
  background: linear-gradient(to bottom, #29A9D5 0%, #239CCA 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#29A9D5', endColorstr='#',GradientType=0 );
}

.tableData .tableDataHead h2 {
  color: white !important;
  text-align: center;
  margin-top: 0;
  padding-top: 10px;
  width: 90%;
  margin: 0 auto;
}

.tableData .tableDataBody {
  padding-bottom: 20px;
}

.tableData .tableDataBody ul {
  list-style-type: none;
  text-align: center;
  width: 85%;
  margin-bottom: 0px;
}

.tableData .tableDataBody li {
  padding: 10px 0;
  border-bottom: 1px solid #EAF0F4;
}

.tableData .tableDataBody li:last-child {
  border-bottom: none !important;
}

.tableData .tableDataBody p {
  width: 85%;
  margin: 0 auto;
}

@media (max-width: 767px) {
  #paymentNav ul {
    margin-left: 3px;
  }
  #paymentNav ul li {
    margin: 0 0 20px -3px;
    display: inline-block;
  }
  #paymentNav .viewEdit {
    float: none !important;
    display: inline-block;
    margin: 20px 0 0 !important;
  }
  #paymentNav ul li.selected a {
    color: white;
    background: #2badd7;
    border-top: 1px solid #2badd7;
  }
  #paymentNav ul li a {
    border: 1px solid #d1f0f5;
  }
  .smallClear {
    clear: both;
  }
}

@media (max-width: 479px) {
  #paymentNav {
    border-bottom: none;
  }
  #paymentNav ul li a {
    padding: 11px 5px;
    font-size: 11px;
  }
  .cardContent .viewEdit {
    float: right !important;
  }
  #paymentNav ul {
    margin-left: 0;
  }
  .helpAndGuidance .gradHead h2 {
    margin-left: 0px;
  }
  .floatLeft.withImage, .floatRight.withImage {
    float: none;
  }
}

#noticeDetails {
  float: left;
  width: 100%;
}

#noticeDetails .gradHead.noBg h2 {
  margin-left: 0;
}

#noticeDetails #formHolder label {
  width: 190px;
}

#noticeDetails #formHolder input, #noticeDetails #formHolder textarea {
  width: 27.5%;
}

#noticeDetails #formHolder select {
  width: 29.3%;
}

#noticeDetails #formHolder .greyButton {
  width: auto !important;
}

#haveYouATag {
  display: none;
}

#calculatorBox {
  border: 1px solid #e5ecf1;
  border-top: none;
  padding: 40px 0;
  position: relative;
  float: left;
  width: 99.6%;
}

#calculatorBox .progress {
  display: none;
  width: 75%;
  margin: 0 auto;
}

#calculatorBox .subBox {
  width: 99%;
}

#calculatorBox .calcimage {
  background: url(../../images/generic/usage-calc-progress-sprite.png) no-repeat;
  width: 287px;
  height: 42px;
  margin: 0 auto;
}

#calculatorBox .calcimage.step2 {
  background-position: 0 -30px;
}

#calculatorBox .calcimage.step3 {
  background-position: 0 -70px;
}

#calculatorBox .calcimage.step4 {
  background-position: 0 -110px;
}

#calculatorBox .calcContent {
  width: 75%;
  margin: 10px auto 0;
  text-align: center;
}

#calculatorBox .calcContent h1 {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
  font-size: 25px;
  line-height: 30px;
}

#calculatorBox #formHolder {
  margin: 0 auto !important;
}

#calculatorBox #formHolder input[type="text"] {
  float: none !important;
}

#calculatorBox #formHolder .error {
  display: none !important;
}

#calculatorBox .calcContent .questionBox p {
  width: 60%;
  text-align: center;
}

#calculatorBox #formHolder .inputNotice {
  float: none;
  display: inline-block;
  font-size: 80%;
}

#calculatorBox #formHolder .inputNotice p {
  font-size: 12px;
}

/* #calculatorBox #formHolder .inputNotice p.message {font-size: 80% !important;} */
#calculatorBox .calcContent .questionBox {
  /*background: url(../../images/generic/usage-calc-panel-bg.png) no-repeat;*/
  background: #FAFCFD;
  border-top: 1px solid #DDECF0;
  border-bottom: 1px solid #DDECF0;
  padding: 17px 0;
  font-size: 17px;
  min-height: 28px;
  margin-bottom: 20px;
}

#calculatorBox .calcContent .questionBox p, #calculatorBox .calcContent .questionBox label, #calculatorBox .calcContent .questionBox input {
  display: inline;
  color: #00325a;
  font-size: 17px;
}

#calculatorBox .calcContent .questionBox label {
  display: inline-block;
  /* padding-left: 15px;  margin-left: 5px;  width: 50px;*/
  background: url(../../images/generic/usage-calc-radio-button-sprite.png) no-repeat;
  height: 25px;
  background-position: 37px 0;
  padding-right: 50px;
  line-height: 25px;
}

#calculatorBox .calcContent .questionBox input[type="radio"] {
  display: none;
}

#calculatorBox .calcContent .questionBox input[type="radio"]:checked + label {
  background-position: 37px -25px;
}

#calculatorBox .calcContent .questionBox input[type="text"] {
  width: 40px;
  margin-left: 5px;
  border-radius: 0px;
  margin-top: -1px;
}

.calcBars {
  background-position: 0 -1771px;
  display: block;
  width: 543px;
  height: 70px;
}

.lt-ie9 .questionBox input[type="radio"] {
  display: inline-block !important;
}

.lt-ie9 #calculatorBox .calcContent .questionBox label {
  background: none;
}

#resultBoxHolders {
  width: 100%;
  float: left;
  margin: 25px 0 20px;
}

#resultBoxHolders .resultBox {
  width: 42%;
  float: left;
  border: 2px solid #e5ecf1;
  padding-bottom: 40px;
}

#resultBoxHolders .resultBox .head {
  width: 70px;
  height: 69px;
  display: block;
  margin: -35px auto 40px;
}

#resultBoxHolders .resultBox.rbleft {
  margin-right: 8%;
}

#resultBoxHolders .resultBox.video .head {
  background-position: 0 -595px;
}

#resultBoxHolders .resultBox.solo {
  float: none;
  margin: 0 auto;
}

#resultBoxHolders .resultBox.tag .head {
  background-position: 0 -264px;
}

#resultBoxHolders .saveAmount {
  font-size: 15px;
  border-bottom: 1px solid #e5ecf1;
  width: 75%;
  margin: 0 auto 20px;
  padding: 0 15px 0;
}

#resultBoxHolders .saveAmount p {
  width: 100%;
}

#resultBoxHolders p {
  font-size: 15px;
  width: 92%;
  margin: 0 auto 20px;
}

#resultBoxHolders span.topLine {
  font-size: 15px !important;
  vertical-align: top;
  line-height: 0px;
}

#resultBoxHolders span.bigAmount {
  font-family: "myriad-pro-n7", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 900;
  font-size: 60px;
  color: #00325a;
  line-height: 50px;
  display: inline-block;
}

#resultBoxHolders p.italics {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-style: italic;
  color: #00325a;
}

.lt-ie8 #resultBoxHolders span.topLine {
  line-height: 60px;
}

.lt-ie8 .twoButtonHolder .first {
  margin-top: -11px !important;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
  border: 1px solid #e3e7ea !important;
}

.lt-ie9 #dashboard #menubar {
  padding-bottom: 100px;
  margin-bottom: -100px;
}

.lt-ie8 #dashboard #menubar {
  padding-bottom: 100px;
  margin-bottom: -100px;
}

#overLay {
  background: rgba(102, 102, 102, 0.5);
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
}

#overLay .overlayContent {
  width: 300px;
  min-height: 170px;
  position: relative;
  margin: 0 auto;
  opacity: 1;
  text-align: center;
  z-index: 2000;
  background: none;
  border: 4px solid #f0f9fd;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}

#overLay .overlayContent .overlayInnerContent {
  position: absolute;
  top: 50%;
  float: left;
  background: #fff;
  border: 4px solid #f0f9fd;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}

#overLay .overlayContent {
  height: auto !important;
  min-height: auto !important;
  border: none !important;
}

.lt-ie8 .formElement {
  width: 300px;
}

#overLay #formHolder .formElement label, #formHolder .formElement .labeler {
  text-align: left !important;
  margin-left: 10px !important;
}

#overLay #newsletterOverlay #formHolder .formElement input {
  width: 30% !important;
}

#overLay #newsletterOverlay #formHolder .formElement label {
  width: 70px !important;
}

#overLay.autoWidth .overlayContent {
  height: 420px !important;
}

#overLay .overlayContent h2 {
  font-family: "myriad-pro-n4", "myriad-pro", Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 24px;
  text-align: center;
  line-height: 30px;
  margin: 20px 0 5px;
  color: #72d0f3;
}

#overLay .overlayContent input {
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  color: white;
  padding: 10px 20px;
  font-size: 16px;
  border: none;
}

#overLay .overlayContent .continue {
  background: #96C038;
}

#overLay .overlayContent .cancel {
  background: #d35757;
  margin-left: 20px;
}

#overLay .overlayContent a {
  display: inline-block;
  padding: 10px;
  color: white;
  font-size: 14px;
}

#overLay #formHolder .formElement input {
  width: 45% !important;
}

#overLay #formHolder .formElement label {
  width: 100px !important;
}

#overLay .overlayContent .formElement input {
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  color: #555555;
  font-size: 16px;
  border: 1px solid #cccccc;
  padding: 5px !important;
}

#overLay .overlayContent .close {
  background: none repeat scroll 0 0 #666666;
  border-radius: 10px 10px 10px 10px;
  color: white;
  display: block;
  height: 20px;
  position: absolute;
  right: 10px;
  top: 10px;
  width: 20px;
  font-size: 10px;
  font-weight: 500;
}

#overLay input.yellowButton {
  margin-top: 5px;
}

#overLay.formContent {
  display: none;
}

#overLay .overlayContent.smallHeight {
  height: auto !important;
}

table.otherTable, table.otherTable td {
  color: #688092;
  font-size: 14px;
  line-height: 20px;
}

#newsLetterSignUp {
  cursor: pointer;
}

@media (max-width: 479px) {
  #overLay .overlayContent {
    width: 290px;
  }
  #overLay #formHolder .formElement label {
    float: left;
    text-align: right;
  }
  #overLay #formHolder .formElement input {
    float: left;
  }
  span.viewEdit.forFAQ {
    float: none !important;
    display: block;
  }
  .faqHolderBox .gradHead h2 {
    margin: 10px 5px;
  }
  #dashboard .dashboardContent .content .header .headText {
    width: 100% !important;
  }
  #dashboard .dashboardContent .content .header.Tag .headText {
    width: 70% !important;
  }
  .headText h2 {
    font-size: 20px;
    margin-bottom: 0;
  }
  #dashboard .dashboardContent .content .header .headText h1 {
    text-align: center !important;
  }
}

.tooltip-inner {
  background: #00325A;
  color: #ffffff;
  max-width: 270px;
  font-style: italic;
  font-size: 12px;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: 500;
}

.tooltip-arrow {
  border-top-color: #00325a !important;
}

@media (max-width: 979px) and (min-width: 768px) {
  .dashboardContent .span10 {
    width: 724px;
  }
}

@media (min-width: 768px) {
  #menubar {
    min-height: 548px;
  }
  .dashboardContent, #menubar {
    padding-bottom: 50px;
    margin-bottom: -100px !important;
  }
  hr.fullWidth {
    margin: 0 -40px 0 -18px !important;
  }
  .helpAndGuidance #faqBox .rightBox p {
    margin: 0;
    width: 100%;
  }
}

.lt-ie9 hr.fullWidth {
  margin: 0 -31px 0 -28px !important;
}

@media (min-width: 768px) and (max-width: 979px) {
  .calcBars {
    background-position: 0 -1841px;
    margin-left: 50px;
    width: 463px;
  }
  #resultBoxHolders {
    margin-left: 10px;
  }
  .yellowButton.doubleUp {
    margin: 10px 0 !important;
    padding: 10px 0 !important;
    width: 100% !important;
  }
  .blueButton.doubleUp {
    margin: 10px 0 !important;
    padding: 10px 0 !important;
    width: 100% !important;
  }
}

@media (max-width: 767px) {
  #dashboard .dashboardContent .content .accountDeets .deetPiece, #dashboard .dashboardContent .content .accountDeets .deetInfo {
    width: 100%;
  }
  #dashboard #menubar {
    margin-left: 0;
    padding-left: 0;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-right: none;
  }
  #dashboard #menubar .content {
    margin-left: 0;
  }
  #dashboard #menubar .menuItems li {
    text-align: center;
  }
  #faqBox .rightBox {
    width: 100% !important;
    margin: 0 !important;
    background: #EBF8FA;
  }
  #faqBox .rightBox p {
    margin: 0 20px 20px;
  }
  .editPayments .greyButton {
    display: block;
  }
  #menubar .menuItems {
    margin-left: auto;
    margin-right: auto;
  }
  #menubar .menuItems li {
    text-align: center;
    display: inline-block;
    padding: 5px;
    border: 1px solid #d1f0f5;
    background: white;
    margin-bottom: 10px;
  }
  #menubar .menuItems li:hover {
    margin: 0 0 10px 0;
    background: #30BBDF;
    margin: 0 0 10px 0;
    border: 1px solid #d1f0f5;
  }
  #menubar .menuItems li:hover a {
    color: white;
  }
  #menubar .menuItems li a {
    padding: 0;
    color: #2badd7;
  }
  #menubar .menuItems li.selected {
    border-bottom: 1px solid #d1f0f5;
    background: #30BBDF;
    margin: 0 0 10px 0;
  }
  #menubar .menuItems li.selected a {
    color: white;
  }
  #menubar .menuItems {
    text-align: center;
  }
  #menubar .menuItems .showMore {
    display: inline-block;
    cursor: pointer;
  }
  #menubar .menuItems .priBeta {
    display: none;
  }
  #resultBoxHolders .resultBox {
    width: 100%;
    margin-bottom: 100px;
  }
  #resultBoxHolders .resultBox .head {
    margin-bottom: 20px;
  }
  .calcBars {
    display: none;
  }
  #resultBoxHolders {
    margin-top: 40px;
  }
}

@media (max-width: 479px) {
  #dashboard #menubar .content {
    width: 95%;
    margin: 0 auto;
    padding: 20px 0px 10px;
  }
  #dashboard .dashboardContent .content .header .headText h1, #dashboard .dashboardContent .content .header .headText .accountType {
    text-align: left;
  }
  #dashboard .dashboardContent .content .header .headText p {
    font-size: 14px;
    margin-top: 0;
  }
  #dashboard .dashboardContent .content .header .headText h1 {
    text-align: left;
    font-size: 20px;
    line-height: 20px;
    margin-top: 10px;
  }
  #dashboard .header {
    width: 100%;
    margin: 0 auto;
  }
  #dashboard .dashboardContent .content .header .icon {
    float: left;
    display: block;
    margin: 0 auto 10px;
  }
  #dashboard .dashboardContent .content .header .icon + .headText {
    width: 70% !important;
  }
  #dashboard .dashboardContent .content span.viewEdit {
    float: left;
  }
  #dashboard .dashboardContent .content .deetInfo span.viewEdit {
    float: right;
  }
  .makePayment.fontSmaller {
    display: block;
    margin-top: 20px;
  }
  .helpAndGuidance ul {
    padding: 10px;
  }
  .helpAndGuidance #faqBox .inputHolder {
    width: 100%;
  }
  .helpAndGuidance #faqBox .inputHolder input {
    width: 80%;
  }
  .gradHead .divider {
    margin: 0 5px;
  }
  .dashboardContent .twoButtonHolder .greyButton, .dashboardContent .twoButtonHolder .yellowButton {
    float: none;
    margin: 20px 0 0 0 !important;
  }
  .formElement.vehicle select, .formElement.vehicle input {
    margin-left: 20px !important;
  }
  .formElement.vehicle select {
    width: 40% !important;
  }
  .dashboardContent .twoButtonHolder .first, .formElement.vehicle .first {
    margin-left: 0 !important;
    display: inline-block;
  }
  #dashboard .dashboardContent .content .borderBox p {
    float: none;
  }
  .infoBox .icon {
    float: left;
    margin: 10px 0 0 10px;
  }
  #noticeDetails #formHolder input, #noticeDetails #formHolder textarea, #noticeDetails #formHolder select {
    width: 100%;
    height: 30px;
    box-sizing: border-box;
  }
  #calculatorBox .calcimage {
    background: none;
    width: auto;
    height: auto;
  }
  #calculatorBox .calcimage .progress {
    display: block;
  }
  #calculatorBox .calcContent .questionBox input, #calculatorBox .calcContent .questionBox label {
    display: inline-block;
  }
  #calculatorBox .calcContent .questionBox {
    border-top: 1px solid #e5ecf1;
    border-bottom: 1px solid #e5ecf1;
    background: #FBFCFE;
    background-image: none;
    padding: 15px;
    margin-bottom: 20px;
  }
  #resultBoxHolders .resultBox .bigAmount {
    display: block;
    margin: 10px 0 15px;
  }
  #resultBoxHolders .resultBox a.yellowButton {
    width: 50%;
  }
  #calculatorBox .calcContent .questionBox p {
    display: block;
  }
}

.withImage img {
  padding: 1px;
}

/* SLIMBOX */
#lbOverlay {
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  cursor: pointer;
}

#lbCenter, #lbBottomContainer {
  position: absolute;
  z-index: 9999;
  overflow: hidden;
  background-color: #fff;
}

.lbLoading {
  background: #fff url(/site-files/images/generic/loading.gif) no-repeat center;
}

#lbImage {
  position: absolute;
  left: 0;
  top: 0;
  border: 10px solid #fff;
  background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
  display: block;
  position: absolute;
  top: 0;
  width: 50%;
  outline: none;
}

#lbBottom {
  font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
  font-size: 10px;
  color: #666;
  line-height: 1.4em;
  text-align: left;
  border: 10px solid #fff;
  border-top-style: none;
}

#lbCloseLink {
  display: block;
  float: right;
  width: 27px;
  height: 27px;
  background: transparent url(/site-files/images/generic/close.png) no-repeat center;
  outline: none;
  margin: 5px 0;
}

#lbCaption, #lbNumber {
  margin-right: 71px;
}

#lbCaption {
  font-weight: 700;
}

/* Accessiblity stylings */
a:focus {
  border: 1px solid #cfeaf7;
  box-sizing: border-box;
}

#footer a:focus {
  border: 1px solid #7fa1bb;
  box-sizing: border-box;
}

#cookieBanner {
  width: 100%;
  position: fixed;
  bottom: 0;
  background: #E5F3FB;
  height: 0px;
  border-top: 1px solid #acd4e0;
  height: auto;
  z-index: 3;
}

#cookieBanner .cookieContent {
  width: 100%;
  max-width: 940px;
  margin: 0 auto;
  padding: 10px 0 0 0;
  box-sizing: border-box;
  position: relative;
}

#cookieBanner .cookieContent p, #cookieBanner .cookieContent a {
  color: #00223c;
  font-size: 18px;
  line-height: 25px;
  font-weight: 500;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
}

#cookieBanner .cookieContent p {
  margin-top: 12px;
  float: left !important;
}

#cookieBanner .cookieContent p a {
  color: #2badd7;
  text-decoration: underline;
  display: inline;
}

#cookieBanner .cookieContent p a:hover {
  color: #2badd7;
  text-decoration: underline;
}

#cookieBanner .cookieContent .cookieClose {
  float: right !important;
  border: none;
  color: #ffffff;
  display: block;
  font-size: 100%;
  font-weight: 900;
  background-color: #2badd7;
  line-height: 1;
  padding: 10px;
  -webkit-appearance: none;
  margin-bottom: 20px;
  text-decoration: none !important;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

#cookieBanner .cookieContent .cookieClose:hover {
  background-color: #abd5e3;
  text-decoration: none;
}

@media (max-width: 479px) {
  #cookieBanner .cookieContent p {
    max-width: 80%;
  }
}

/* pay-a-penalty - overwrite for smartphone style */
@media (max-width: 479px) {
  .gradHead {
    margin-bottom: 0px !important;
  }
}

@media (max-width: 767px) {
  .pay-a-penalty #registration {
    padding: 0;
  }
  .pay-a-penalty #registration .regTop h1 {
    text-align: left;
  }
  .pay-a-penalty .gradHead {
    background: #f9fdfe;
    border-bottom: 1px solid #d4ecfa;
    padding: 5px 0;
    margin: 20px 0;
    float: left;
    width: 100%;
  }
  .pay-a-penalty #formHolder {
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
  }
  .pay-a-penalty #formHolder .yellowButton {
    padding: 13px 0;
  }
  .pay-a-penalty #formHolder #payPenalty label {
    width: 100%;
    text-align: left;
  }
  .pay-a-penalty #formHolder #payPenalty input {
    width: 97%;
    padding: 10px 0 10px 10px;
  }
  .pay-a-penalty #formHolder #payPenalty input[type="submit"] {
    width: 100%;
  }
}

/* --------------------- */
/* @-webkit-keyframes moveAcross{from{background-position:0 0}to{background-position: 10000px 0}}
@-moz-keyframes moveAcross{from{background-position:0 0}to{background-position: 10000px 0}}
@-ms-keyframes moveAcross{from{background-position:0 0}to{background-position: 10000px 0}}
@-o-keyframes moveAcross{from{background-position:0 0}to{background-position: 10000px 0}}
@keyframes moveAcross{from{background-position:0 0}to{background-position: 10000px 0}} */
.maintenance-mode {
  color: darkred;
  background-color: #ffdddd;
  border: 5px solid darkred;
  width: 10%;
  min-width: 135px;
  text-align: center;
  font-size: 1.3em;
  font-weight: bold;
  text-transform: uppercase;
  position: fixed;
  top: 80px;
  left: 0;
  padding: 40px;
  opacity: 0.8;
}

.or-cancel {
  position: relative;
  top: 5px;
}

.cancel-link {
  color: red;
}

#formHolder.no-bottom-margin {
  margin-bottom: 0;
  border-bottom: 1px solid #d4ecfa;
}

#formHolder.top-border, #reassign-buttons.top-border {
  margin-bottom: 0;
  border-top: 1px solid #d4ecfa;
  padding-top: 20px;
}

#formHolder .formElement .no-width {
  width: auto;
}

#reassign-buttons {
  margin-top: 20px;
}

.media-component {
  max-width: 600px;
  margin: 30px auto;
}

.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}

.embed-responsive iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
}

.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}

.embed-responsive-4by3 {
  padding-bottom: 75%;
}

.video-label {
  padding: 20px;
  margin: 0;
  background: #f0f9fd;
  font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
  color: #00325a;
  font-size: 17.5px;
  font-weight: 600;
  line-height: 1.3;
}

.company-details-open {
  display: block;
}

.company-details {
  display: none;
}

/* Helper Classes */
.uppercase {
  text-transform: uppercase;
}

.v-align-middle {
  vertical-align: middle;
}

.width50 {
  width: 50% !important;
}

.width100 {
  width: 100% !important;
}

.width80 {
  width: 80% !important;
}

.withMarginTop {
  margin-top: 20px;
}

/* Partial SCSS files */
.modal {
  border: none;
  box-shadow: none;
  border-radius: 0px;
  background-color: transparent;
}

.modal .close {
  position: fixed;
  top: 20px;
  right: 20px;
  height: 30px;
  color: white;
  opacity: 1;
  font-size: 36px;
}

.modal.fade.in {
  top: 20%;
}

.modal .navyButton {
  font-size: 16px;
}

.modal--pay-a-toll input,
.modal--pay-a-toll button:not(.close),
.modal--pay-a-toll a {
  display: block;
  margin: 0px auto;
  width: 80% !important;
}

.modal--pay-a-toll input:first-child,
.modal--pay-a-toll button:not(.close):first-child,
.modal--pay-a-toll a:first-child {
  margin-bottom: 50px;
}

.form-steps {
  margin: 18px 0px 30px;
  list-style: none;
  display: table;
  width: 100%;
  table-layout: fixed;
}

.form-steps li {
  position: relative;
  display: table-cell;
  z-index: 1;
}

.form-steps li:not(:last-child):after {
  border-top: 2px solid #eaeaea;
  content: '';
  display: inline-block;
  position: absolute;
  top: 20px;
  width: 100%;
  z-index: -1;
}

.form-steps li:not(:last-child):after {
  left: 50%;
}

.form-steps li.active .form-steps__step, .form-steps li.completed .form-steps__step {
  border: none;
}

.form-steps li.active .form-steps__step {
  color: white;
  background-color: #32bcd6;
}

.form-steps li.completed .form-steps__step {
  background-image: url("/site-files/images/generic/register-success-tick.png") !important;
  background-size: 100% auto;
  background-repeat: no-repeat;
  color: transparent;
}

.form-steps li .form-steps__step {
  margin: 0px auto;
  width: 41px;
  height: 41px;
  border-radius: 50%;
  color: #999;
  font-size: 23px;
  background-color: #f5f7f6;
  border: 1px solid #eaeaea;
}

.form-steps li .form-steps__step span {
  position: relative;
  top: 9px;
}

.expandable__content {
  display: none;
}

.expandable__label {
  display: inline-block;
  margin-top: 10px;
  width: auto;
  text-align: left;
  color: #2badd7;
  cursor: pointer;
}

.expandable__label:before, .expandable__label:after {
  border-top: none;
}

.expandable__label:hover {
  color: #005580;
}

.expandable__label--with-line {
  display: table;
  width: 100%;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
}

.expandable__label--with-line:before, .expandable__label--with-line:after {
  border-top: 1px solid #d5ecfb;
  content: '';
  display: table-cell;
  position: relative;
  top: .8em;
  width: 45%;
}

.expandable__label--with-line:before {
  right: 1.5%;
}

.expandable__label--with-line:after {
  left: 1.5%;
}

.expandable i {
  display: inline-block;
  position: relative;
  width: 15px;
  height: 11px;
  top: 3px;
  margin-left: 5px;
  background-image: url("/site-files/images/blue_arrow_down.png") !important;
  background-size: 15px auto;
  background-repeat: no-repeat;
}

.expandable.active i {
  background-image: url("/site-files/images/blue_arrow_up.png") !important;
}

@media screen and (min-width: 768px) {
  .expandable--rows-mobile .expandable__label {
    display: none;
  }
}

#filterBar {
  width: 100%;
  float: left;
  background: #FBFCFE;
  padding-top: 10px;
  margin: 0px;
}

#filterBar input,
#filterBar select {
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
}

#filterBar .filterContent {
  margin: 0 auto;
  width: 100%;
  padding: 0px 10px;
  box-sizing: border-box;
}

#filterBar .filterContent select {
  padding: 4px 4px 4px 2px;
}

#filterBar .filterBox {
  float: left;
  position: relative;
  width: 100%;
  margin-left: 0px;
  margin-bottom: 0px;
}

#filterBar .filterBox.first {
  width: 240px;
}

#filterBar .filterBox .input {
  width: 150px;
  border: 1px solid #e5ecf1;
  float: left;
  padding: 4px 6px;
  cursor: pointer;
  text-decoration: none !important;
  background: #ffffff;
  background: -moz-linear-gradient(top, white 0%, white 42%, #f0ece9 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(42%, white), color-stop(100%, #f0ece9));
  background: -webkit-linear-gradient(top, white 0%, white 42%, #f0ece9 100%);
  background: -o-linear-gradient(top, white 0%, white 42%, #f0ece9 100%);
  background: -ms-linear-gradient(top, white 0%, white 42%, #f0ece9 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #ffffff 42%, #f0ece9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f0ece9', GradientType=0);
}

#filterBar .filterBox .input.small {
  width: 70px;
}

#filterBar .filterBox span.box {
  width: 100px;
  border: 1px solid #688092;
  display: inline-block;
}

#filterBar .filterBox .dropContent {
  height: 0;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  padding: 0;
}

#filterBar .filterBox .labelStyle {
  display: block;
  float: none;
  margin-right: 5px;
  margin-bottom: 0px;
  font-size: 14px;
  font-weight: normal;
  line-height: 30px;
}

#filterBar .filterBox label {
  line-height: 30px;
}

#filterBar .filterBox input {
  width: 150px;
}

#filterBar .filterBox input.smallInput {
  width: 70px;
}

#filterBar .filterBox .fromContent,
#filterBar .filterBox .toContent {
  display: block;
  float: left;
  width: 50%;
  box-sizing: border-box;
}

#filterBar .filterBox .fromContent label,
#filterBar .filterBox .toContent label {
  display: block;
  margin-bottom: 0px;
  width: 100%;
}

#filterBar .filterBox .fromContent input#to,
#filterBar .filterBox .fromContent input#from,
#filterBar .filterBox .toContent input#to,
#filterBar .filterBox .toContent input#from {
  display: block;
  margin-left: 0px;
  margin-right: 0px;
  padding: 4px 6px;
  width: 100%;
  box-sizing: border-box;
}

#filterBar .filterBox .fromContent {
  padding-right: 5px;
}

#filterBar .filterBox .toContent {
  padding-left: 5px;
}

#filterBar .filterBox #away-tolls {
  display: block;
  width: 100%;
  max-width: none;
}

#filterBar .filterBox #away-tolls[name="searchplate"] {
  margin-bottom: 0px;
}

#filterBar .filterBox input#from,
#filterBar .filterBox input#to {
  height: 30px;
}

#filterBar .filterBox input#from {
  margin-left: 5px;
  margin-right: 5px;
}

#filterBar .filterBox input#to {
  margin-left: 5px;
}

#filterBar .filterBox select,
#filterBar .filterBox input,
#filterBar .filterBox label {
  float: left;
  margin-bottom: 10px;
}

#filterBar .filterBox input[type="submit"] {
  display: block;
  margin: 0px auto 10px;
  float: none;
  width: auto;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}

#filterBar .dropDowner {
  position: absolute;
  top: -9999px;
  width: 142px;
  line-height: 21px;
  padding: 10px;
  border: 1px solid #cccccc;
  z-index: -1;
  background: #FFFFFF;
  left: 0;
}

#filterBar .dropDowner.lefter {
  left: 68px;
}

#filterBar .dropDowner input {
  width: 90%;
  margin-left: 0;
}

#filterBar .dropDowner input[type="checkbox"] {
  width: auto;
  margin-right: 10px;
}

#filterBar .dropDowner .cbHolder {
  margin-top: 5px;
  clear: both;
}

#filterBar .dropDowner a {
  margin-left: 6px;
}

#filterBar .dropDowner hr {
  margin: 10px 0;
}

#filterBar .dropDowner input#tagID {
  width: 70px;
}

#filterBar .dropDowner .multiSelect {
  position: relative;
  float: left;
  margin-left: 10px;
}

#filterBar .dropDowner .multiSelect label {
  color: #2badd7;
  font-weight: 600;
}

#filterBar .dropDowner label {
  font-size: 12px;
  margin-bottom: 0;
}

#filterBar .dropDowner input.sa,
#filterBar .dropDowner input.sn {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

#filterBar .dropDowner .touch input.sa,
#filterBar .dropDowner .touch input.sn {
  position: absolute;
  top: 5px;
  left: 10px;
  /*opacity: 0;*/
}

#filterBar .dropDowner hr {
  margin: 5px 0;
}

#filterBar .dropContent.open {
  height: auto;
  overflow: visible;
  opacity: 1;
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

#filterBar .dropContent.open .dropDowner {
  z-index: 1;
  top: 33px;
}

@media screen and (min-width: 480px) {
  #filterBar {
    padding: 10px 13%;
    box-sizing: border-box;
  }
}

@media screen and (min-width: 768px) {
  #filterBar {
    padding: 10px 9px;
  }
  #filterBar .filterBox {
    width: auto;
  }
  #filterBar .filterBox .fromContent,
  #filterBar .filterBox .toContent,
  #filterBar .filterBox .toContent label,
  #filterBar .filterBox .fromContent label,
  #filterBar .filterBox .labelStyle,
  #filterBar .filterBox select,
  #filterBar .filterBox input {
    float: left;
    width: auto;
  }
  #filterBar .filterBox .toContent input#to,
  #filterBar .filterBox .toContent input#from,
  #filterBar .filterBox .fromContent input#to,
  #filterBar .filterBox .fromContent input#from {
    margin-right: 10px;
    width: 84px;
  }
  #filterBar .filterBox .toContent label,
  #filterBar .filterBox .fromContent label {
    margin-right: 5px;
  }
  #filterBar .filterBox .fromContent {
    padding-right: 0px;
  }
  #filterBar .filterBox .toContent {
    padding-left: 0px;
  }
  #filterBar .filterBox #away-tolls {
    margin-right: 9px;
    width: auto;
    max-width: 130px;
  }
  #filterBar .filterBox #away-tolls[name="searchplate"] {
    margin-bottom: 10px;
    width: auto;
  }
  #filterBar .filterBox input[type="submit"] {
    position: relative;
    top: -1px;
  }
}

@media (max-width: 479px) {
  #filterBar .dropDowner.lefter {
    left: 0;
  }
}

.lt-ie8 #filterBar .dropContent {
  display: none;
}

.lt-ie8 #filterBar .dropContent.open {
  display: inline-block;
  left: -160px;
}

.lt-ie8 .filterBox span.floatRight {
  float: none;
  margin-left: 10px;
}

.PayAPenalty .journeyBox {
  position: relative;
}

.PayAPenalty .journeyBox .penalty-checkbox {
  position: absolute;
  top: 15px;
  left: 15px;
}

.PayAPenalty .journeyBox .journeyInfo label {
  margin-left: 20px;
}

@media (max-width: 767px) {
  .PayAPenalty .PayAPenalty__form .journeyBox {
    border: 0;
    float: left;
    border-bottom: 1px solid #c3c4c5;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .row:before {
    display: block;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .row:after {
    clear: inherit;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .span5 {
    width: 45%;
    float: left;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .span2 {
    width: 10%;
    float: left;
    text-align: center;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .span2 input {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journeyInfo {
    padding: 10px 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journeyInfo label {
    margin: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty-total p {
    font-weight: 600;
    font-size: 17px;
    color: #00325a;
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty-location p {
    font-size: 17px;
    color: #00325a;
    margin-bottom: 3px;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty {
    padding: 0;
    text-align: left;
    font-size: 17px;
    margin: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty.open {
    display: none;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty p {
    color: #32bcd6;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox hr.jhr {
    border-color: #c3c4c5;
    width: 100%;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox p.date {
    color: #00325a;
    font-size: 17px;
    letter-spacing: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journeyInfo {
    padding: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journey-ref {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 0px;
    color: #00325a;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .information {
    padding: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .information p {
    color: #00325a;
    padding: 0;
    margin: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty-checkbox {
    position: absolute;
    top: 5px;
    left: auto;
    right: 15px;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox--heading {
    margin-bottom: 20px;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox--heading .span5 {
    color: #00325a;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox--heading .span2 {
    color: #32bcd6;
  }
  .PayAPenalty .PayAPenalty__details {
    border-bottom: 1px solid #c3c4c5;
    float: left;
    width: 100%;
  }
  .PayAPenalty .PayAPenalty__details p {
    text-transform: uppercase;
    color: #00325a;
  }
  .PayAPenalty .PayAPenalty__details .reference-date {
    float: left;
    width: 50px;
    margin-right: 30px;
  }
  .PayAPenalty .PayAPenalty__details .amount-direction {
    float: left;
    width: 120px;
    margin-right: 30px;
  }
  .PayAPenalty .PayAPenalty__details .select {
    float: left;
    width: 30px;
  }
  .PayAPenalty .PayAPenalty__details .select p {
    color: #00325a;
    text-align: right;
  }
}

@media (max-width: 373px) {
  .PayAPenalty .PayAPenalty__form .journeyBox {
    border: 0;
    float: left;
    border-bottom: 1px solid #c3c4c5;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .row:before {
    display: block;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .row:after {
    clear: inherit;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .span3 {
    width: 130px;
    float: left;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journeyInfo {
    padding: 10px 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journeyInfo label {
    margin: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty-total p {
    font-weight: 600;
    font-size: 17px;
    color: #00325a;
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty-location p {
    font-size: 17px;
    color: #00325a;
    margin-bottom: 3px;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty {
    padding: 0;
    text-align: left;
    font-size: 17px;
    margin: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .penalty p {
    color: #32bcd6;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox hr.jhr {
    border-color: #c3c4c5;
    width: 100%;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox p.date {
    color: #00325a;
    font-size: 17px;
    letter-spacing: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .journeyInfo {
    padding: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .information {
    padding: 0;
  }
  .PayAPenalty .PayAPenalty__form .journeyBox .information p {
    color: #00325a;
  }
}

.slick-slider.my-account-mobile-nav__list {
  position: relative;
}

.slick-slider.my-account-mobile-nav__list .slick-list {
  padding: 0px 73px;
  box-sizing: border-box;
  overflow: hidden;
}

.slick-slider.my-account-mobile-nav__list .slick-arrow {
  position: absolute;
  top: 0px;
  width: 73px;
  height: 100%;
  border: none;
  border-radius: 0px;
  z-index: 1;
  color: transparent;
  background-color: #f8fcfe;
}

.slick-slider.my-account-mobile-nav__list .slick-arrow:focus {
  outline: none;
}

.slick-slider.my-account-mobile-nav__list .slick-arrow.slick-disabled {
  cursor: default;
  opacity: 0.3;
}

.slick-slider.my-account-mobile-nav__list .slick-arrow.slick-prev {
  left: 0px;
  outline: 1px solid #c3c4c5;
  background-image: url("/site-files/images/blue_arrow_left.png") !important;
  background-size: 20px auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.slick-slider.my-account-mobile-nav__list .slick-arrow.slick-next {
  right: 0px;
  background-image: url("/site-files/images/blue_arrow_right.png") !important;
  background-size: 20px auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.my-account-mobile-nav {
  display: block;
  width: 100%;
  background: white;
  float: left;
  border-top: 1px solid #c3c4c5;
  border-bottom: 1px solid #c3c4c5;
  margin-bottom: 30px;
}

.my-account-mobile-nav ul {
  display: table;
  position: relative;
  width: 100%;
  table-layout: fixed;
  margin: 0;
  text-align: center;
}

.my-account-mobile-nav ul li {
  display: table-cell;
  border-right: 1px solid #c3c4c5;
  height: 60px;
  padding: 5px;
  background: #f8fcfe;
}

.my-account-mobile-nav ul li:first-child {
  border-left: 1px solid #c3c4c5;
}

.my-account-mobile-nav ul li:hover {
  background: #2badd7;
  color: white;
}

.my-account-mobile-nav ul li:hover p {
  color: white;
}

.my-account-mobile-nav ul li.active {
  background: #2badd7;
  color: white;
}

.my-account-mobile-nav ul li.active p {
  color: white;
}

.my-account-mobile-nav ul li.active .icon {
  border-right: 1px solid #2badd7;
}

.my-account-mobile-nav ul li:hover .icon__overview, .my-account-mobile-nav ul li.active .icon__overview {
  background-image: url("/site-files/images/user-account-images/overview_over.png");
}

.my-account-mobile-nav ul li:hover .icon__my-details, .my-account-mobile-nav ul li.active .icon__my-details {
  background-image: url("/site-files/images/user-account-images/my_details_over.png");
}

.my-account-mobile-nav ul li:hover .icon__my-vehicles, .my-account-mobile-nav ul li.active .icon__my-vehicles {
  background-image: url("/site-files/images/user-account-images/my_vehicles_over.png");
}

.my-account-mobile-nav ul li:hover .icon__my-bill, .my-account-mobile-nav ul li.active .icon__my-bill {
  background-image: url("/site-files/images/user-account-images/my_bill_over.png");
}

.my-account-mobile-nav ul li:hover .icon__journey-and-payments, .my-account-mobile-nav ul li.active .icon__journey-and-payments {
  background-image: url("/site-files/images/user-account-images/journeys_payments_over.png");
}

.my-account-mobile-nav ul li:hover .icon__user-management, .my-account-mobile-nav ul li.active .icon__user-management {
  background-image: url("/site-files/images/user-account-images/user_management_over.png");
}

.my-account-mobile-nav ul li:hover .icon__fleet-nominations, .my-account-mobile-nav ul li.active .icon__fleet-nominations {
  background-image: url("/site-files/images/user-account-images/overview_over.png");
}

.my-account-mobile-nav ul li a {
  text-decoration: none;
}

.my-account-mobile-nav ul li a:focus {
  border: 0;
}

.my-account-mobile-nav ul li p {
  font-size: 12px;
  line-height: 12px;
  color: #688092;
  margin: 4px 0;
}

.my-account-mobile-nav .icon {
  height: 28px;
  width: auto;
  display: block;
  margin: 3px auto 0;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: auto 28px;
}

.my-account-mobile-nav .icon.icon__overview {
  background-image: url("/site-files/images/user-account-images/overview.png");
  margin-bottom: 8px;
}

.my-account-mobile-nav .icon.icon__my-details {
  background-image: url("/site-files/images/user-account-images/my_details.png");
  margin-bottom: 8px;
}

.my-account-mobile-nav .icon.icon__my-vehicles {
  background-size: auto 20px;
  background-image: url("/site-files/images/user-account-images/my_vehicles.png");
  margin-bottom: 8px;
}

.my-account-mobile-nav .icon.icon__my-bill {
  background-image: url("/site-files/images/user-account-images/my_bill.png");
  margin-bottom: 8px;
}

.my-account-mobile-nav .icon.icon__journey-and-payments {
  background-image: url("/site-files/images/user-account-images/journeys_payments.png");
  margin-bottom: 5px;
}

.my-account-mobile-nav .icon.icon__user-management {
  background-image: url("/site-files/images/user-account-images/user_management.png");
  margin-bottom: 5px;
}

.my-account-mobile-nav .icon.icon__fleet-nominations {
  background-image: url("/site-files/images/user-account-images/overview.png");
  margin-bottom: 5px;
}

@media screen and (min-width: 768px) {
  .my-account-mobile-nav {
    display: none;
  }
}

.statementDetails__smartphone .gradHead {
  background: transparent;
  border-bottom: 0;
}

.statementDetails__smartphone .gradHead h2 {
  text-align: left;
  margin-left: 0;
}

.statementDetails__smartphone .thead {
  font-size: 13px;
}

.smartbanner {
  display: none;
  left: 0;
  top: 0;
  width: 100%;
  padding: 10px 0px;
  font-family: "Helvetica Neue", helvetica, arial, sans-serif;
  background: #fff;
  overflow: hidden;
  border-bottom: 1px solid #ccc;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: none;
}

.smartbanner-close {
  position: absolute;
  left: 7px;
  top: 30px;
  font-family: 'ArialRoundedMTBold',Arial;
  font-size: 15px;
  text-align: center;
  text-decoration: none;
  border-radius: 14px;
  -webkit-font-smoothing: subpixel-antialiased;
  border: 0;
  width: 17px;
  height: 17px;
  line-height: 17px;
  color: #b1b1b3;
  background: #efefef;
  z-index: 10;
}

.smartbanner-close:focus {
  text-decoration: none;
}

.smartbanner-link {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
  padding-left: 35px;
  box-sizing: border-box;
}

.smartbanner-link:hover, .smartbanner-link:focus {
  text-decoration: none;
}

.smartbanner-close:active, .smartbanner-close:hover {
  color: #333;
}

.smartbanner-icon {
  display: inline-block;
  width: 57px;
  height: 57px;
  padding-right: 57px;
  box-sizing: border-box;
  background-color: #fff;
  background-size: cover;
  background-image: url("http://is4.mzstatic.com/image/thumb/Purple122/v4/ee/74/16/ee741640-8c50-ef7b-99cd-52aa7d0b2188/source/175x175bb.jpg");
}

.smartbanner-info {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.2em;
  color: #999;
  padding-left: 10px;
  padding-right: 10px;
}

.smartbanner-title {
  font-size: 15px;
  line-height: 17px;
  color: #000;
  font-weight: bold;
}

.smartbanner-button {
  margin-left: auto;
  margin-right: 10px;
  border-bottom: 3px solid #1ab7ea;
  padding: 0 10px;
  width: 50px;
  height: 24px;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
  font-weight: bold;
  color: #fff;
  background-color: #1ab7ea;
  text-decoration: none;
  border-radius: 5px;
}

.smartbanner-button:hover {
  background-color: #1ab7ea;
  text-decoration: none;
}

.smartbanner-button:focus {
  height: 24px;
  border-bottom: 2px solid #1ab7ea;
  box-sizing: content-box;
}

.smartbanner-button-text {
  text-align: center;
  display: block;
  padding: 1px 5px 0px;
  text-decoration: none;
}

table.table {
  font-size: 14px;
  margin-bottom: 0;
}

table.table tr.first {
  text-align: center;
  background: #29A9D5;
}

table.table tr.first td {
  color: white;
  font-weight: 700;
}

table.table tr td {
  border: 1px solid #cfeaf7;
  vertical-align: middle;
}

.table-responsive {
  width: 100%;
  border: 1px solid #cfeaf7;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  margin: 30px 0;
}

@media (min-width: 375px) {
  .table-responsive {
    border: 0;
    margin: 20px 0;
  }
}

@media (max-width: 375px) {
  .table-responsive {
    margin: 10px 0;
  }
}

@media screen and (max-width: 767px) {
  .pay-a-toll#registration {
    padding-top: 10px;
  }
  .pay-a-toll#registration .regTop h1 {
    padding-bottom: 5px;
    margin-bottom: 0px;
    text-align: left;
    border-bottom: 2px solid #f7f7f7;
  }
  .pay-a-toll#registration .regTop p {
    font-size: 16px;
    line-height: 1.3em;
  }
  .pay-a-toll#registration .gradHead {
    border: 1px solid #d4ecfa;
    border-radius: 3px;
    margin-bottom: 0px;
  }
  .pay-a-toll#registration .gradHead h2 {
    text-align: left;
    line-height: 40px;
    padding-top: 0px;
  }
  .pay-a-toll#registration #vehicleDetails {
    margin-top: 0px;
  }
  .pay-a-toll#registration #formHolder {
    margin: 5px 0px;
  }
  .pay-a-toll#registration #creditCardDetails {
    margin: 0px 5px;
  }
  .pay-a-toll#registration #creditCardDetails .formElement {
    padding-top: 7px;
    border-bottom: 1px solid #e8e8e8;
  }
  .pay-a-toll#registration #creditCardDetails .formElement--no-border {
    border-bottom: none;
  }
  .pay-a-toll#registration #payPenalty {
    margin-bottom: 0px;
    padding: 20px 12px 40px;
    background-color: #F0F9FD;
    border: 1px solid #d1f0f5;
    box-sizing: border-box;
  }
  .pay-a-toll#registration #payPenalty input#vehRegNo {
    margin-bottom: 20px;
    padding: 8px 15px 10px;
    height: 50px;
    width: 100%;
    box-sizing: border-box;
    font-size: 18px;
  }
  .pay-a-toll#registration #payPenalty input[type='submit'] {
    padding: 12px 20px;
    width: 100% !important;
  }
  .pay-a-toll#registration #payPenalty label {
    font-size: 16px;
    width: auto !important;
  }
  .pay-a-toll#registration tr {
    padding: 0px;
  }
  .pay-a-toll#registration td {
    padding: 30px 0px 10px 6px;
    height: auto;
    width: 100%;
  }
  .pay-a-toll#registration td:not(:last-child) {
    border-bottom: 1px solid #ccc;
  }
  .pay-a-toll#registration td:hover {
    cursor: pointer;
    background-color: #f8fcff;
  }
}

@media screen and (max-width: 767px) {
  .PayAPenalty#registration {
    padding-top: 10px;
  }
  .PayAPenalty#registration .regTop h1 {
    padding-bottom: 5px;
    margin-bottom: 0px;
    text-align: left;
    border-bottom: 2px solid #f7f7f7;
  }
  .PayAPenalty#registration .regTop p {
    font-size: 16px;
    line-height: 1.3em;
  }
  .PayAPenalty#registration .gradHead {
    margin-bottom: 0px;
    border-bottom: none;
    background: none;
  }
  .PayAPenalty#registration .gradHead--with-border {
    padding-left: 10px;
    border: 1px solid #d4ecfa;
    background: #f9fdfe;
    box-sizing: border-box;
  }
  .PayAPenalty#registration .gradHead--with-border h2 {
    margin: 0px !important;
    font-size: 17px !important;
  }
  .PayAPenalty#registration .gradHead hr {
    margin: 0px;
  }
  .PayAPenalty#registration .gradHead h2 {
    margin: 10px 0px;
    padding-top: 0px;
    text-align: left;
    line-height: 40px;
    font-size: 24px;
  }
  .PayAPenalty#registration #vehicleDetails {
    margin-top: 0px;
  }
  .PayAPenalty#registration #creditCardDetails {
    margin: 0px 5px;
  }
  .PayAPenalty#registration #formHolder {
    margin: 5px 0px;
  }
  .PayAPenalty#registration #creditCardDetails {
    margin: 0px 5px;
  }
  .PayAPenalty#registration #creditCardDetails .formElement {
    padding-top: 7px;
    border-bottom: 1px solid #e8e8e8;
  }
  .PayAPenalty#registration #creditCardDetails .formElement--no-border {
    border-bottom: none;
  }
  .PayAPenalty#registration #payPenalty {
    margin-bottom: 0px;
    padding: 20px 12px 0px;
    background-color: #F0F9FD;
    border: 1px solid #d1f0f5;
    box-sizing: border-box;
  }
  .PayAPenalty#registration #payPenalty input#journeyRefNo,
  .PayAPenalty#registration #payPenalty input#vehRegNo {
    margin-bottom: 20px;
    padding: 8px 15px 10px;
    height: 50px;
    width: 100%;
    box-sizing: border-box;
    font-size: 18px;
  }
  .PayAPenalty#registration #payPenalty input[type='submit'] {
    margin-top: 5px;
    width: 100% !important;
  }
  .PayAPenalty#registration #payPenalty label {
    font-size: 16px;
    width: auto !important;
  }
}

@media (max-width: 767px) {
  #paymentSummaryRow .gradStyle {
    margin-left: 0px !important;
    margin-bottom: -30px !important;
  }
  #paymentSummaryRow #paymentSummary {
    border: none;
  }
  #paymentSummaryRow #paymentSummary table.penaltyTable {
    width: 100% !important;
  }
  #paymentSummaryRow #paymentSummary table.penaltyTable thead tr {
    border: none;
  }
  #paymentSummaryRow #paymentSummary table.penaltyTable tbody tr {
    border-bottom: 1px solid #d1f0f5;
  }
  #paymentSummaryRow #paymentSummary table td {
    height: auto;
    min-height: 70px;
    padding-top: 30px !important;
    padding-left: 6px;
  }
  #paymentSummaryRow #paymentSummary .totalAmount {
    text-align: left;
  }
  #paymentSummaryRow #vehicleDetails {
    margin-top: 0px;
  }
  #paymentSummaryRow .canvas #vehicleDetails td {
    display: block;
    width: 100%;
    max-width: none;
  }
}

@media screen and (max-width: 767px) {
  .open-an-account {
    padding: 20px 0px !important;
  }
  .open-an-account#registration .regTop h1 {
    padding-bottom: 5px;
    margin-bottom: 0px;
    text-align: left;
    border-bottom: 2px solid #f7f7f7;
  }
  .open-an-account#registration .regTop p {
    font-size: 16px;
    line-height: 1.3em;
  }
  .open-an-account#registration .headerHolder {
    margin: 40px auto;
    width: 80%;
    text-align: center;
  }
  .open-an-account#registration .headerHolder h2 {
    font-family: "myriad-pro-n6", "myriad-pro", Arial, Helvetica, sans-serif;
    font-weight: 600;
    color: #00325a;
    font-size: 36px;
  }
  .open-an-account#registration .headerHolder p {
    font-family: "myriad-pro-n3", "myriad-pro", Arial, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 24px;
    color: #688092;
    line-height: 1.2;
  }
  .open-an-account#registration [name="plate_number"] {
    margin-right: 10px;
  }
  .open-an-account#registration [for="username"],
  .open-an-account#registration [for="cardName"],
  .open-an-account#registration [for="Vehicle Registration Number"],
  .open-an-account#registration [for="billingType"],
  .open-an-account#registration [for="secretQuestion"] {
    margin-top: 10px;
  }
  .open-an-account#registration [name="username"],
  .open-an-account#registration [name="newPassword"],
  .open-an-account#registration [name="confirmPassword"],
  .open-an-account#registration [name="securityQuestion"],
  .open-an-account#registration [name="securityAnswer"] {
    width: 100%;
    height: 30px;
    box-sizing: border-box;
  }
  .open-an-account#registration label {
    width: 100%;
    text-align: left;
    box-sizing: border-box;
  }
  .open-an-account#registration #formHolder {
    float: none;
  }
  .open-an-account#registration .tableHolder tbody tr {
    border-top: 1px solid #ccc !important;
    padding-bottom: 0px !important;
  }
  .open-an-account#registration .tableHolder tbody td {
    padding: 10px 0px !important;
    border-bottom: 1px solid #ccc !important;
  }
  .open-an-account#registration #creditCardDetails {
    margin: 0px;
  }
  .open-an-account#registration #summaryHolder {
    float: left;
    margin-top: 10px;
  }
  .open-an-account#registration .helpToggleIcon {
    display: none;
  }
  .open-an-account#registration .password-strength {
    width: 100%;
    box-sizing: border-box;
  }
}
      
    


    .roxen-edit-box-off { }
    .roxen-edit-box-on {
      outline:          1px dotted #f8bb7b;
      /*background:       #f2f1eb;*/
      background:       #faf9f3;
      -moz-outline:     1px dotted #f8bb7b;     /*  FIXME: invalid CSS  */
    }
    .roxen-edit-marker-off {
      visibility:       hidden;
      display:          block;
      position:         absolute;
    }
    .roxen-edit-marker-on {
      visibility:       visible;
      display:          block;
      position:         absolute;
      background:       URL(/site-files/cms-templates/images/button_edit_comp.gif)
                        top left no-repeat;
      width:            28px;
      height:           13px;
      z-index:          1;
    }
    div.roxen-linkbrowser-anchor a {
      visibility:       visible;
      display:          block;
      position:         absolute;
      background:       URL(/site-files/cms-templates/images/button_link_browser.gif)
                        top left no-repeat;
      width:            28px;
      height:           13px;
      z-index:          1;
    }
  
}
@media screen {

}
@media print {

}