@charset "UTF-8";

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('../../font/sourcesanspro_light.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url('../../font/sourcesanspro_regular.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url('../../font/sourcesanspro_semibold.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('../../font/sourcesanspro_bold.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* ==========================================================================
  Browser support
  ========================================================================== */
/* Typography
   ========================================================================== */
/* Grid
   ========================================================================== */
/*! normalize.css v2.1.3 | MIT License | git.io/normalize */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

audio,
canvas,
video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden],
template {
  display: none; }

body {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-family: "Source Sans Pro", sans-serif;
  margin: 0; }

a {
  background: transparent; }

a:focus {
  outline: thin dotted; }

a:active,
a:hover {
  outline: 0; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

mark {
  background: #ff0;
  color: #000; }

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em; }

pre {
  white-space: pre-wrap; }

q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

small {
  font-size: 80%; }

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

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 0; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0; }

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0; }

button,
input {
  line-height: normal; }

button,
select {
  text-transform: none; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled],
html input[disabled] {
  cursor: default; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto;
  vertical-align: top; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html {
  font-size: 62.5%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

body {
  font-size: 15px;
  line-height: 1.5;
  color: #5d6e73;
  background-color: transparent; }

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

a {
  color: #49a8d5;
  text-decoration: none; }
  a:hover, a:focus {
    color: #2780aa;
    text-decoration: underline; }
  a:focus {
    outline: thin dotted #333;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px; }

img {
  vertical-align: middle; }

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto; }

.img-rounded {
  border-radius: 6px; }

.img-circle {
  border-radius: 50%; }

hr {
  margin-top: 22px;
  margin-bottom: 22px;
  border: 0;
  border-top: 1px solid #eeeeee; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0; }

p {
  margin: 0 0 11px; }

.lead {
  margin-bottom: 22px;
  font-size: 17px;
  font-weight: 200;
  line-height: 1.4; }
  @media (min-width: 768px) {
    .lead {
      font-size: 22.5px; } }

small,
.small {
  font-size: 85%; }

cite {
  font-style: normal; }

.text-muted {
  color: #d4d9da !important; }

.text-primary {
  color: #1b92cb; }
  .text-primary:hover {
    color: #15729e; }

.text-warning {
  color: #c1b293; }
  .text-warning:hover {
    color: #ae9b73; }

.text-danger {
  color: #b94242; }
  .text-danger:hover {
    color: #933535; }

.text-success {
  color: #74af7e; }
  .text-success:hover {
    color: #589863; }

.text-info {
  color: #8e8837; }
  .text-info:hover {
    color: #696529; }

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

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

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 400;
  line-height: 1.5;
  color: #34928a; }
  h1 small,
  h1 .small, h2 small,
  h2 .small, h3 small,
  h3 .small, h4 small,
  h4 .small, h5 small,
  h5 .small, h6 small,
  h6 .small,
  .h1 small,
  .h1 .small, .h2 small,
  .h2 .small, .h3 small,
  .h3 .small, .h4 small,
  .h4 .small, .h5 small,
  .h5 .small, .h6 small,
  .h6 .small {
    font-weight: normal;
    line-height: 1;
    color: #999999; }

h1,
h2,
h3 {
  margin-top: 22px;
  margin-bottom: 11px; }
  h1 small,
  h1 .small,
  h2 small,
  h2 .small,
  h3 small,
  h3 .small {
    font-size: 65%; }

h4,
h5,
h6 {
  margin-top: 11px;
  margin-bottom: 11px; }
  h4 small,
  h4 .small,
  h5 small,
  h5 .small,
  h6 small,
  h6 .small {
    font-size: 75%; }

h1, .h1 {
  font-size: 20px; }

h2, .h2 {
  font-size: 22px; }

h3, .h3 {
  font-size: 18px; }

h4, .h4 {
  font-size: 18px; }

h5, .h5 {
  font-size: 16px; }

h6, .h6 {
  font-size: 15px; }

.page-header {
  padding-bottom: 10px;
  margin: 44px 0 22px;
  border-bottom: 1px solid #eeeeee; }

ul,
ol {
  margin-top: 0;
  margin-bottom: 11px; }
  ul ul,
  ul ol,
  ol ul,
  ol ol {
    margin-bottom: 0; }

.list-unstyled, .list-inline, .list-inline-divider, .list-vertical-divider, .list-vertical-divider-2, .page-footer .list-footer, .list-breadcrumb, .list-steps, .headers .nav-list, .page-footer .list-legal {
  padding-left: 0;
  list-style: none; }

.list-inline > li, .list-inline-divider > li, .list-vertical-divider > li, .list-vertical-divider-2 > li, .page-footer .list-footer > li, .list-breadcrumb > li, .list-steps > li, .headers .nav-list > li, .page-footer .list-legal > li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px; }
  .list-inline > li:first-child, .list-inline-divider > li:first-child, .list-vertical-divider > li:first-child, .list-vertical-divider-2 > li:first-child, .page-footer .list-footer > li:first-child, .list-breadcrumb > li:first-child, .list-steps > li:first-child, .headers .nav-list > li:first-child, .page-footer .list-legal > li:first-child {
    padding-left: 0; }

dl {
  margin-bottom: 22px; }

dt,
dd {
  line-height: 1.5; }

dt {
  font-weight: bold; }

dd {
  margin-left: 0; }

abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #999999; }

abbr.initialism {
  font-size: 90%;
  text-transform: uppercase; }

blockquote {
  padding: 11px 22px;
  margin: 0 0 22px;
  border-left: 5px solid #eeeeee; }
  blockquote p {
    font-size: 18.75px;
    font-weight: 300;
    line-height: 1.25; }
  blockquote p:last-child {
    margin-bottom: 0; }
  blockquote small {
    display: block;
    line-height: 1.5;
    color: #999999; }
    blockquote small:before {
      content: '\2014 \00A0'; }
  blockquote.pull-right {
    padding-right: 15px;
    padding-left: 0;
    border-right: 5px solid #eeeeee;
    border-left: 0; }
    blockquote.pull-right p,
    blockquote.pull-right small,
    blockquote.pull-right .small {
      text-align: right; }
    blockquote.pull-right small:before,
    blockquote.pull-right .small:before {
      content: ''; }
    blockquote.pull-right small:after,
    blockquote.pull-right .small:after {
      content: '\00A0 \2014'; }

blockquote:before,
blockquote:after {
  content: ""; }

address {
  margin-bottom: 22px;
  font-style: normal;
  line-height: 1.5; }

code,
kbd,
pre,
samp {
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace; }

code {
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  white-space: nowrap;
  border-radius: 4px; }

pre {
  display: block;
  padding: 10.5px;
  margin: 0 0 11px;
  font-size: 14px;
  line-height: 1.5;
  word-break: break-all;
  word-wrap: break-word;
  color: #333333;
  background-color: whitesmoke;
  border: 1px solid #cccccc;
  border-radius: 4px; }
  pre code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0; }

.pre-scrollable {
  max-height: 340px;
  overflow-y: scroll; }

.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px; }
  .container:before, .container:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .container:after {
    clear: both; }

.row {
  margin-left: -15px;
  margin-right: -15px; }
  .row:before, .row:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .row:after {
    clear: both; }

@media (min-width: 768px) {
  .container {
    width: 750px; }
}
@media (min-width: 992px) {
  .container {
    width: 970px; }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px; }
}

table {
  max-width: 100%;
  background-color: transparent; }

th {
  text-align: left; }


table col[class*="col-"] {
  float: none;
  display: table-column; }

table td[class*="col-"],
table th[class*="col-"] {
  float: none;
  display: table-cell; }


fieldset {
  padding: 0;
  margin: 0;
  border: 0; }

legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: 22px;
  font-size: 22.5px;
  line-height: inherit;
  color: #333333;
  border: 0;
  border-bottom: 1px solid #e5e5e5; }

label {
  display: inline-block;
  margin-bottom: 5px;
  font-weight: bold; }

input[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  /* IE8-9 */
  line-height: normal; }

input[type="file"] {
  display: block; }

select[multiple],
select[size] {
  height: auto; }

select optgroup {
  font-size: inherit;
  font-style: inherit;
  font-family: inherit; }

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {
  height: auto; }

output {
  display: block;
  padding-top: 9px;
  font-size: 15px;
  line-height: 1.5;
  color: #555555;
  vertical-align: middle; }

.form-control:-moz-placeholder {
  color: #9faaad; }
.form-control::-moz-placeholder {
  color: #9faaad; }
.form-control:-ms-input-placeholder {
  color: #9faaad; }
.form-control::-webkit-input-placeholder {
  color: #9faaad; }

.form-control {
  display: block;
  width: 100%;
  height: 40px;
  padding: 8px 20px;
  font-size: 15px;
  line-height: 1.5;
  color: #555555;
  vertical-align: middle;
  background-color: white;
  background-image: none;
  border: 1px solid #cccccc;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; }
  .form-control:focus {
    border-color: #49a8d5;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(73, 168, 213, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(73, 168, 213, 0.6); }
  .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    cursor: not-allowed;
    background-color: #eeeeee; }

textarea.form-control {
  height: auto; }

.form-group {
  margin-bottom: 15px; }

.radio,
.checkbox {
  display: block;
  min-height: 22px;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-left: 20px;
  vertical-align: middle; }
  .radio label,
  .checkbox label {
    display: inline;
    margin-bottom: 0;
    font-weight: normal;
    cursor: pointer; }

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  float: left;
  margin-left: -20px; }

.radio + .radio,
.checkbox + .checkbox {
  margin-top: -5px; }

.radio-inline,
.checkbox-inline {
  display: inline-block;
  padding-left: 20px;
  margin-bottom: 0;
  vertical-align: middle;
  font-weight: normal;
  cursor: pointer; }

.radio-inline + .radio-inline,
.checkbox-inline + .checkbox-inline {
  margin-top: 0;
  margin-left: 10px; }

input[type="radio"][disabled], fieldset[disabled] input[type="radio"],
input[type="checkbox"][disabled], fieldset[disabled]
input[type="checkbox"],
.radio[disabled], fieldset[disabled]
.radio,
.radio-inline[disabled], fieldset[disabled]
.radio-inline,
.checkbox[disabled], fieldset[disabled]
.checkbox,
.checkbox-inline[disabled], fieldset[disabled]
.checkbox-inline {
  cursor: not-allowed; }

.input-sm {
  height: 25px;
  padding: 2px 10px;
  font-size: 13px;
  line-height: 1.5;
  border-radius: 3px; }

select.input-sm {
  height: 25px;
  line-height: 25px; }

textarea.input-sm {
  height: auto; }

.input-lg {
  height: 47px;
  padding: 10px 26px;
  font-size: 19px;
  line-height: 1.33;
  border-radius: 6px; }

select.input-lg {
  height: 47px;
  line-height: 47px; }

textarea.input-lg {
  height: auto; }

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline {
  color: #c1b293; }
.has-warning .form-control {
  border-color: #c1b293;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
  .has-warning .form-control:focus {
    border-color: #ae9b73;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #e6e0d4;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #e6e0d4; }
.has-warning .input-group-addon {
  color: #c1b293;
  border-color: #c1b293;
  background-color: #f7eacd; }

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline {
  color: #b94242; }
.has-error .form-control {
  border-color: #b94242;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
  .has-error .form-control:focus {
    border-color: #933535;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d68b8b;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d68b8b; }
.has-error .input-group-addon {
  color: #b94242;
  border-color: #b94242;
  background-color: #cb7171; }

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline {
  color: #74af7e; }
.has-success .form-control {
  border-color: #74af7e;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
  .has-success .form-control:focus {
    border-color: #589863;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #b5d4ba;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #b5d4ba; }
.has-success .input-group-addon {
  color: #74af7e;
  border-color: #74af7e;
  background-color: #676767; }

.form-control-static {
  margin-bottom: 0; }

.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #9fadb1; }

@media (min-width: 768px) {
  .form-inline .form-group, .navbar-form .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle; }
  .form-inline .form-control, .navbar-form .form-control {
    display: inline-block; }
  .form-inline .radio, .navbar-form .radio,
  .form-inline .checkbox,
  .navbar-form .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0; }
  .form-inline .radio input[type="radio"], .navbar-form .radio input[type="radio"],
  .form-inline .checkbox input[type="checkbox"],
  .navbar-form .checkbox input[type="checkbox"] {
    float: none;
    margin-left: 0; } }

.form-horizontal .control-label,
.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 9px; }
.form-horizontal .form-group {
  margin-left: -15px;
  margin-right: -15px; }
  .form-horizontal .form-group:before, .form-horizontal .form-group:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .form-horizontal .form-group:after {
    clear: both; }
.form-horizontal .form-control-static {
  padding-top: 9px; }
@media (min-width: 768px) {
  .form-horizontal .control-label {
    text-align: right; } }

.btn, .island-button, .forgot-password-button {
  display: inline-block;
  margin-bottom: 0;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 8px 20px;
  font-size: 15px;
  line-height: 1.5;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none; }
  .btn:focus, .island-button:focus, .forgot-password-button:focus {
    outline: thin dotted #333;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px; }
  .btn:hover, .island-button:hover, .forgot-password-button:hover, .btn:focus, .island-button:focus, .forgot-password-button:focus {
    color: #333333;
    text-decoration: none; }
  .btn:active, .island-button:active, .forgot-password-button:active, .btn.active, .active.island-button, .active.forgot-password-button {
    outline: 0;
    background-image: none;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); }
  .btn.disabled, .disabled.island-button, .disabled.forgot-password-button, .btn[disabled], [disabled].island-button, [disabled].forgot-password-button, fieldset[disabled] .btn, fieldset[disabled] .island-button, fieldset[disabled] .forgot-password-button {
    cursor: not-allowed;
    pointer-events: none;
    opacity: 0.65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none; }

.btn-link {
  color: #49a8d5;
  font-weight: normal;
  cursor: pointer;
  border-radius: 0; }
  .btn-link, .btn-link:active, .btn-link[disabled], fieldset[disabled] .btn-link {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none; }
  .btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active {
    border-color: transparent; }
  .btn-link:hover, .btn-link:focus {
    color: #2780aa;
    text-decoration: underline;
    background-color: transparent; }
  .btn-link[disabled]:hover, .btn-link[disabled]:focus, fieldset[disabled] .btn-link:hover, fieldset[disabled] .btn-link:focus {
    color: #999999;
    text-decoration: none; }

.btn-lg, .btn-group-lg > .btn, .btn-group-lg > .island-button, .btn-group-lg > .forgot-password-button, .island-button, .forgot-password-button {
  padding: 10px 26px;
  font-size: 19px;
  line-height: 1.33;
  border-radius: 6px; }

.btn-sm, .btn-group-sm > .btn, .btn-group-sm > .island-button, .btn-group-sm > .forgot-password-button,
.btn-xs,
.btn-group-xs > .btn,
.btn-group-xs > .island-button,
.btn-group-xs > .forgot-password-button {
  padding: 2px 10px;
  font-size: 13px;
  line-height: 1.5;
  border-radius: 3px; }

.btn-xs, .btn-group-xs > .btn, .btn-group-xs > .island-button, .btn-group-xs > .forgot-password-button {
  padding: 1px 5px; }

.btn-block, .island-button, .forgot-password-button {
  display: block;
  width: 100%;
  padding-left: 0;
  padding-right: 0; }

.btn-block + .btn-block, .island-button + .btn-block, .forgot-password-button + .btn-block, .btn-block + .island-button, .island-button + .island-button, .forgot-password-button + .island-button, .btn-block + .forgot-password-button, .island-button + .forgot-password-button, .forgot-password-button + .forgot-password-button {
  margin-top: 5px; }

input[type="submit"].btn-block, input[type="submit"].island-button, input[type="submit"].forgot-password-button,
input[type="reset"].btn-block,
input[type="reset"].island-button,
input[type="reset"].forgot-password-button,
input[type="button"].btn-block,
input[type="button"].island-button,
input[type="button"].forgot-password-button {
  width: 100%; }

.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear; }
  .fade.in {
    opacity: 1; }

.collapse {
  display: none; }
  .collapse.in {
    display: block; }

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition: height 0.35s ease;
  transition: height 0.35s ease; }

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px solid black;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  border-bottom: 0 dotted; }

.dropdown {
  position: relative; }

.dropdown-toggle:focus {
  outline: 0; }

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 15px;
  background-color: white;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box; }
  .dropdown-menu.pull-right {
    right: 0;
    left: auto; }
  .dropdown-menu .divider {
    height: 1px;
    margin: 10px 0;
    overflow: hidden;
    background-color: #e5e5e5; }
  .dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.5;
    color: #333333;
    white-space: nowrap; }

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
  text-decoration: none;
  color: #262626;
  background-color: whitesmoke; }

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
  color: white;
  text-decoration: none;
  outline: 0;
  background-color: #1b92cb; }

.dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
  color: #999999; }

.dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  cursor: not-allowed; }

.open > .dropdown-menu {
  display: block; }
.open > a {
  outline: 0; }

.dropdown-header {
  display: block;
  padding: 3px 20px;
  font-size: 13px;
  line-height: 1.5;
  color: #999999; }

.dropdown-backdrop {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 990; }

.pull-right > .dropdown-menu {
  right: 0;
  left: auto; }

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  border-top: 0 dotted;
  border-bottom: 4px solid black;
  content: ""; }
.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 1px; }

@media (min-width: 768px) {
  .navbar-right .dropdown-menu {
    right: 0;
    left: auto; } }
.btn-default .caret {
  border-top-color: #333333; }
.btn-primary .caret, .btn-success .caret, .btn-warning .caret, .btn-danger .caret, .btn-info .caret {
  border-top-color: #fff; }

.dropup .btn-default .caret {
  border-bottom-color: #333333; }
.dropup .btn-primary .caret,
.dropup .btn-success .caret,
.dropup .btn-warning .caret,
.dropup .btn-danger .caret,
.dropup .btn-info .caret {
  border-bottom-color: #fff; }

.btn .caret, .island-button .caret, .forgot-password-button .caret {
  margin-left: 0; }

.btn-lg .caret, .btn-group-lg > .btn .caret, .island-button .caret, .forgot-password-button .caret {
  border-width: 5px 5px 0;
  border-bottom-width: 0; }

.dropup .btn-lg .caret, .dropup .btn-group-lg > .btn .caret, .dropup .island-button .caret, .dropup .forgot-password-button .caret {
  border-width: 0 5px 5px; }

[data-toggle="buttons"] > .btn > input[type="radio"], [data-toggle="buttons"] > .island-button > input[type="radio"], [data-toggle="buttons"] > .forgot-password-button > input[type="radio"],
[data-toggle="buttons"] > .btn > input[type="checkbox"],
[data-toggle="buttons"] > .island-button > input[type="checkbox"],
[data-toggle="buttons"] > .forgot-password-button > input[type="checkbox"] {
  display: none; }

.nav {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none; }
  .nav:before, .nav:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .nav:after {
    clear: both; }
  .nav > li {
    position: relative;
    display: block; }
    .nav > li > a {
      position: relative;
      display: block;
      padding: 5px 10px; }
      .nav > li > a:hover, .nav > li > a:focus {
        text-decoration: none;
        background-color: #eeeeee; }
    .nav > li.disabled > a {
      color: #999999; }
      .nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
        color: #999999;
        text-decoration: none;
        background-color: transparent;
        cursor: not-allowed; }
  .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: #eeeeee;
    border-color: #49a8d5; }
    .nav .open > a .caret, .nav .open > a:hover .caret, .nav .open > a:focus .caret {
      border-top-color: #2780aa;
      border-bottom-color: #2780aa; }
  .nav .nav-divider {
    height: 1px;
    margin: 10px 0;
    overflow: hidden;
    background-color: #e5e5e5; }
  .nav > li > a > img {
    max-width: none; }

.nav .caret {
  border-top-color: #49a8d5;
  border-bottom-color: #49a8d5; }

.nav a:hover .caret {
  border-top-color: #2780aa;
  border-bottom-color: #2780aa; }

.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-right-radius: 0;
  border-top-left-radius: 0; }

.navbar {
  position: relative;
  min-height: 75px;
  margin-bottom: 0;
  border: 1px solid transparent; }
  .navbar:before, .navbar:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .navbar:after {
    clear: both; }
  @media (min-width: 768px) {
    .navbar {
      border-radius: 4px; } }

.navbar-header:before, .navbar-header:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }
.navbar-header:after {
  clear: both; }
@media (min-width: 768px) {
  .navbar-header {
    float: left; } }

.navbar-collapse {
  max-height: 340px;
  overflow-x: visible;
  padding-right: 15px;
  padding-left: 15px;
  border-top: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-overflow-scrolling: touch; }
  .navbar-collapse:before, .navbar-collapse:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .navbar-collapse:after {
    clear: both; }
  .navbar-collapse.in {
    overflow-y: auto; }
  @media (min-width: 768px) {
    .navbar-collapse {
      width: auto;
      border-top: 0;
      box-shadow: none; }
      .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important; }
      .navbar-collapse.in {
        overflow-y: auto; }
      .navbar-collapse .navbar-nav.navbar-left:first-child {
        margin-left: -15px; }
      .navbar-collapse .navbar-nav.navbar-right:last-child {
        margin-right: -15px; }
      .navbar-collapse .navbar-text:last-child {
        margin-right: 0; } }

.container > .navbar-header,
.container > .navbar-collapse {
  margin-right: -15px;
  margin-left: -15px; }
  @media (min-width: 768px) {
    .container > .navbar-header,
    .container > .navbar-collapse {
      margin-right: 0;
      margin-left: 0; } }

.navbar-static-top {
  z-index: 1000;
  border-width: 0 0 1px; }
  @media (min-width: 768px) {
    .navbar-static-top {
      border-radius: 0; } }

.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030; }
  @media (min-width: 768px) {
    .navbar-fixed-top,
    .navbar-fixed-bottom {
      border-radius: 0; } }

.alert {
  padding: 15px;
  margin-bottom: 22px;
  border: 1px solid transparent;
  border-radius: 6px; }
  .alert h4 {
    margin-top: 0;
    color: inherit; }
  .alert .alert-link {
    font-weight: bold; }
  .alert > p,
  .alert > ul {
    margin-bottom: 0; }
  .alert > p + p {
    margin-top: 5px; }

.alert-dismissable {
  padding-right: 35px; }
  .alert-dismissable .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit; }

.alert-success {
  background-color: #99d1a1;
  border-color: #74af7e;
  color: #676767; }
  .alert-success hr {
    border-top-color: #64a66f; }
  .alert-success .alert-link {
    color: #4e4e4e; }

.alert-info, .alert-notice {
  background-color: #c8e9ed;
  border-color: #8ac0c4;
  color: #676767; }
  .alert-info hr, .alert-notice hr {
    border-top-color: #79b7bb; }
  .alert-info .alert-link, .alert-notice .alert-link {
    color: #4e4e4e; }

.alert-warning {
  background-color: #f7eacd;
  border-color: #c1b293;
  color: #676767; }
  .alert-warning hr {
    border-top-color: #b8a683; }
  .alert-warning .alert-link {
    color: #4e4e4e; }

.alert-danger {
  background-color: #cb7171;
  border-color: #b94242;
  color: #f8f8f8; }
  .alert-danger hr {
    border-top-color: #a63b3b; }
  .alert-danger .alert-link {
    color: #dfdfdf; }

.media,
.media-body {
  overflow: hidden;
  zoom: 1; }

.media,
.media .media {
  margin-top: 15px; }

.media:first-child {
  margin-top: 0; }

.media-object {
  display: block; }

.media-heading {
  margin: 0 0 5px; }

.media > .pull-left {
  margin-right: 10px; }
.media > .pull-right {
  margin-left: 10px; }

.media-list {
  padding-left: 0;
  list-style: none; }

.list-group {
  margin-bottom: 20px;
  padding-left: 0; }

.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: white;
  border: 1px solid #dddddd; }
  .list-group-item:first-child {
    border-top-right-radius: 0;
    border-top-left-radius: 0; }
  .list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0; }
  .list-group-item > .badge {
    float: right; }
  .list-group-item > .badge + .badge {
    margin-right: 5px; }

a.list-group-item {
  color: #555555; }
  a.list-group-item .list-group-item-heading {
    color: #333333; }
  a.list-group-item:hover, a.list-group-item:focus {
    text-decoration: none;
    background-color: whitesmoke; }
  a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
    z-index: 2;
    color: white;
    background-color: #1b92cb;
    border-color: #1b92cb; }
    a.list-group-item.active .list-group-item-heading, a.list-group-item.active:hover .list-group-item-heading, a.list-group-item.active:focus .list-group-item-heading {
      color: inherit; }
    a.list-group-item.active .list-group-item-text, a.list-group-item.active:hover .list-group-item-text, a.list-group-item.active:focus .list-group-item-text {
      color: #bce3f6; }

.list-group-item-heading {
  margin-top: 0;
  margin-bottom: 5px; }

.list-group-item-text {
  margin-bottom: 0;
  line-height: 1.3; }

.panel {
  margin-bottom: 22px;
  background-color: white;
  border: 1px solid transparent;
  border-radius: 0;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); }

.panel-body {
  padding: 15px; }
  .panel-body:before, .panel-body:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
  .panel-body:after {
    clear: both; }

.panel > .list-group {
  margin-bottom: 0; }
  .panel > .list-group .list-group-item {
    border-width: 1px 0; }
    .panel > .list-group .list-group-item:first-child {
      border-top-right-radius: 0;
      border-top-left-radius: 0; }
    .panel > .list-group .list-group-item:last-child {
      border-bottom: 0; }

.modal-open {
  overflow: hidden; }

.modal {
  display: none;
  overflow: auto;
  overflow-y: scroll;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040; }
  .modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out; }
  .modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0); }

.modal-header {
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
  min-height: 16.5px; }

@media screen and (min-width: 768px) {
  .modal-content {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); } }
.tooltip {
  position: absolute;
  z-index: 1030;
  display: block;
  visibility: visible;
  font-size: 13px;
  line-height: 1.4;
  opacity: 0;
  filter: alpha(opacity=0); }
  .tooltip.in {
    opacity: 0.9;
    filter: alpha(opacity=90); }
  .tooltip.top {
    margin-top: -3px;
    padding: 5px 0; }
  .tooltip.right {
    margin-left: 3px;
    padding: 0 5px; }
  .tooltip.bottom {
    margin-top: 3px;
    padding: 5px 0; }
  .tooltip.left {
    margin-left: -3px;
    padding: 0 5px; }

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #d4d9da;
  text-align: center;
  text-decoration: none;
  background-color: #414141;
  border-radius: 4px; }

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #414141; }
.tooltip.top-left .tooltip-arrow {
  bottom: 0;
  left: 5px;
  border-width: 5px 5px 0;
  border-top-color: #414141; }
.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  right: 5px;
  border-width: 5px 5px 0;
  border-top-color: #414141; }
.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #414141; }
.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #414141; }
.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #414141; }
.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  left: 5px;
  border-width: 0 5px 5px;
  border-bottom-color: #414141; }
.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  right: 5px;
  border-width: 0 5px 5px;
  border-bottom-color: #414141; }

@-ms-viewport {
  width: device-width; }

.visible-xs,
tr.visible-xs,
th.visible-xs,
td.visible-xs {
  display: none !important; }

@media (max-width: 767px) {
  .visible-xs {
    display: block !important; }

  tr.visible-xs {
    display: table-row !important; }

  th.visible-xs,
  td.visible-xs {
    display: table-cell !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .visible-xs.visible-sm {
    display: block !important; }

  tr.visible-xs.visible-sm {
    display: table-row !important; }

  th.visible-xs.visible-sm,
  td.visible-xs.visible-sm {
    display: table-cell !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-xs.visible-md {
    display: block !important; }

  tr.visible-xs.visible-md {
    display: table-row !important; }

  th.visible-xs.visible-md,
  td.visible-xs.visible-md {
    display: table-cell !important; } }
@media (min-width: 1200px) {
  .visible-xs.visible-lg {
    display: block !important; }

  tr.visible-xs.visible-lg {
    display: table-row !important; }

  th.visible-xs.visible-lg,
  td.visible-xs.visible-lg {
    display: table-cell !important; } }
.visible-sm,
tr.visible-sm,
th.visible-sm,
td.visible-sm {
  display: none !important; }

@media (max-width: 767px) {
  .visible-sm.visible-xs {
    display: block !important; }

  tr.visible-sm.visible-xs {
    display: table-row !important; }

  th.visible-sm.visible-xs,
  td.visible-sm.visible-xs {
    display: table-cell !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important; }

  tr.visible-sm {
    display: table-row !important; }

  th.visible-sm,
  td.visible-sm {
    display: table-cell !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-sm.visible-md {
    display: block !important; }

  tr.visible-sm.visible-md {
    display: table-row !important; }

  th.visible-sm.visible-md,
  td.visible-sm.visible-md {
    display: table-cell !important; } }
@media (min-width: 1200px) {
  .visible-sm.visible-lg {
    display: block !important; }

  tr.visible-sm.visible-lg {
    display: table-row !important; }

  th.visible-sm.visible-lg,
  td.visible-sm.visible-lg {
    display: table-cell !important; } }
.visible-md,
tr.visible-md,
th.visible-md,
td.visible-md {
  display: none !important; }

@media (max-width: 767px) {
  .visible-md.visible-xs {
    display: block !important; }

  tr.visible-md.visible-xs {
    display: table-row !important; }

  th.visible-md.visible-xs,
  td.visible-md.visible-xs {
    display: table-cell !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .visible-md.visible-sm {
    display: block !important; }

  tr.visible-md.visible-sm {
    display: table-row !important; }

  th.visible-md.visible-sm,
  td.visible-md.visible-sm {
    display: table-cell !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important; }

  tr.visible-md {
    display: table-row !important; }

  th.visible-md,
  td.visible-md {
    display: table-cell !important; } }
@media (min-width: 1200px) {
  .visible-md.visible-lg {
    display: block !important; }

  tr.visible-md.visible-lg {
    display: table-row !important; }

  th.visible-md.visible-lg,
  td.visible-md.visible-lg {
    display: table-cell !important; } }
.visible-lg,
tr.visible-lg,
th.visible-lg,
td.visible-lg {
  display: none !important; }

@media (max-width: 767px) {
  .visible-lg.visible-xs {
    display: block !important; }

  tr.visible-lg.visible-xs {
    display: table-row !important; }

  th.visible-lg.visible-xs,
  td.visible-lg.visible-xs {
    display: table-cell !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .visible-lg.visible-sm {
    display: block !important; }

  tr.visible-lg.visible-sm {
    display: table-row !important; }

  th.visible-lg.visible-sm,
  td.visible-lg.visible-sm {
    display: table-cell !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-lg.visible-md {
    display: block !important; }

  tr.visible-lg.visible-md {
    display: table-row !important; }

  th.visible-lg.visible-md,
  td.visible-lg.visible-md {
    display: table-cell !important; } }
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important; }

  tr.visible-lg {
    display: table-row !important; }

  th.visible-lg,
  td.visible-lg {
    display: table-cell !important; } }
.hidden-xs {
  display: block !important; }

tr.hidden-xs {
  display: table-row !important; }

th.hidden-xs,
td.hidden-xs {
  display: table-cell !important; }

@media (max-width: 767px) {
  .hidden-xs,
  tr.hidden-xs,
  th.hidden-xs,
  td.hidden-xs {
    display: none !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-xs.hidden-sm,
  tr.hidden-xs.hidden-sm,
  th.hidden-xs.hidden-sm,
  td.hidden-xs.hidden-sm {
    display: none !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-xs.hidden-md,
  tr.hidden-xs.hidden-md,
  th.hidden-xs.hidden-md,
  td.hidden-xs.hidden-md {
    display: none !important; } }
@media (min-width: 1200px) {
  .hidden-xs.hidden-lg,
  tr.hidden-xs.hidden-lg,
  th.hidden-xs.hidden-lg,
  td.hidden-xs.hidden-lg {
    display: none !important; } }
.hidden-sm {
  display: block !important; }

tr.hidden-sm {
  display: table-row !important; }

th.hidden-sm,
td.hidden-sm {
  display: table-cell !important; }

@media (max-width: 767px) {
  .hidden-sm.hidden-xs,
  tr.hidden-sm.hidden-xs,
  th.hidden-sm.hidden-xs,
  td.hidden-sm.hidden-xs {
    display: none !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm,
  tr.hidden-sm,
  th.hidden-sm,
  td.hidden-sm {
    display: none !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-sm.hidden-md,
  tr.hidden-sm.hidden-md,
  th.hidden-sm.hidden-md,
  td.hidden-sm.hidden-md {
    display: none !important; } }
@media (min-width: 1200px) {
  .hidden-sm.hidden-lg,
  tr.hidden-sm.hidden-lg,
  th.hidden-sm.hidden-lg,
  td.hidden-sm.hidden-lg {
    display: none !important; } }
.hidden-md {
  display: block !important; }

tr.hidden-md {
  display: table-row !important; }

th.hidden-md,
td.hidden-md {
  display: table-cell !important; }

@media (max-width: 767px) {
  .hidden-md.hidden-xs,
  tr.hidden-md.hidden-xs,
  th.hidden-md.hidden-xs,
  td.hidden-md.hidden-xs {
    display: none !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-md.hidden-sm,
  tr.hidden-md.hidden-sm,
  th.hidden-md.hidden-sm,
  td.hidden-md.hidden-sm {
    display: none !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md,
  tr.hidden-md,
  th.hidden-md,
  td.hidden-md {
    display: none !important; } }
@media (min-width: 1200px) {
  .hidden-md.hidden-lg,
  tr.hidden-md.hidden-lg,
  th.hidden-md.hidden-lg,
  td.hidden-md.hidden-lg {
    display: none !important; } }
.hidden-lg {
  display: block !important; }

tr.hidden-lg {
  display: table-row !important; }

th.hidden-lg,
td.hidden-lg {
  display: table-cell !important; }

@media (max-width: 767px) {
  .hidden-lg.hidden-xs,
  tr.hidden-lg.hidden-xs,
  th.hidden-lg.hidden-xs,
  td.hidden-lg.hidden-xs {
    display: none !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-lg.hidden-sm,
  tr.hidden-lg.hidden-sm,
  th.hidden-lg.hidden-sm,
  td.hidden-lg.hidden-sm {
    display: none !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-lg.hidden-md,
  tr.hidden-lg.hidden-md,
  th.hidden-lg.hidden-md,
  td.hidden-lg.hidden-md {
    display: none !important; } }
@media (min-width: 1200px) {
  .hidden-lg,
  tr.hidden-lg,
  th.hidden-lg,
  td.hidden-lg {
    display: none !important; } }
.visible-print,
tr.visible-print,
th.visible-print,
td.visible-print {
  display: none !important; }

@media print {
  .visible-print {
    display: block !important; }

  tr.visible-print {
    display: table-row !important; }

  th.visible-print,
  td.visible-print {
    display: table-cell !important; }

  .hidden-print,
  tr.hidden-print,
  th.hidden-print,
  td.hidden-print {
    display: none !important; } }

/*
 * clearfix     used project wide to clear floats and create a new formatting context
 * usage      @include clearfix-me(<empty|overflow|facebook|micro|stubborn>)
 * $clearfix-method sets default method
 */
.box, .box .boxHead,
.box .boxFoot, .list-vertical-divider, .list-vertical-divider-2 {
  zoom: 1; }
  .box:before, .box .boxHead:before,
  .box .boxFoot:before, .list-vertical-divider:before, .list-vertical-divider-2:before, .box:after, .box .boxHead:after,
  .box .boxFoot:after, .list-vertical-divider:after, .list-vertical-divider-2:after {
    content: " ";
    display: table; }
  .box:after, .box .boxHead:after,
  .box .boxFoot:after, .list-vertical-divider:after, .list-vertical-divider-2:after {
    clear: both; }

.footer-login, .page-wrap-login:after {
  display: table-cell; }
  .footer-login:after, .page-wrap-login:after {
    clear: both;
    display: block;
    visibility: hidden;
    overflow: hidden;
    height: 0 !important;
    line-height: 0;
    font-size: xx-large;
    content: "x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x"; }

/**
	* @desc         Base box mixin for grouping content
	* @name         Box Mixin
	* @author       mobywhale
	* @tested       Chrome, Firefox, IE7-9  
	* @requires     variables.scss
	*/
.box {
  position: relative; }
  .box .boxHead,
  .box .boxFoot {
    padding: 0 30px; }
  .box .boxBody {
    padding: 0 30px; }

/**
* @desc         Create spacing classes and default spacing.
* @name         Whitespace
* @author       Fiona
* @tested       Safari, Chrome, Firefox, IE7-9
* @requires     _variables.scss
*/
/* ==========================================================================
   Default spacing
   ========================================================================== */
.box {
  margin-top: 1.5;
  margin-bottom: 1.5; }

table h1, table h2, table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl, table blockquote, table .media, table pre {
  margin-top: 0;
  margin-bottom: 0; }

/*doc
---
title: Typography
name: type
category: Base CSS
---

Headings can be used to define the applications typographical hierarchy.

```haml_example
%h1 h1.heading level 1
%h2 h2.heading level 2
%h3 h3.heading level 3
%h4 h4.heading level 4
%h5 h5.heading level 5
%h6 h6.heading level 6
%p This is an example of our base font styles. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
```

### Separating code and visual semantics

Sometimes you may need to use a heading which has different visual and code semantics. You can accomplish this by combining classes with elements (classes take visual precedence over elements in this case):

```haml_example
  %h2.h1 h2.heading level 1 class applied
```

If it's not a heading but you need similar visual treatment you can add just the class to any element
  (Use headings when possible since they add semantic value).

```haml_example
  %div.h2 div.heading level 2
```

*/
h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
  font-weight: 400;
  text-transform: none; }

h1, .h1 {
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .03em; }

h2, .h2 {
  font-weight: 400;
  color: #5d6e73; }

h4, .h4 {
  color: #5d6e73; }

h5, .h5 {
  color: #78868a; }

h6, .h6 {
  color: #5d6e73;
  margin-bottom: 0;
  margin-top: 5px;
  font-weight: 600; }

/*doc
---
title: Alignment
name: alignment
parent: type
category: Base CSS
---

Alignment classes can be used to align text top, bottom, middle or left, right, center.

Class                 | Description
--------------------- | -----------------
`.txt-l`              | Aligns text to the left
`.txt-r`              | Aligns text to the right
`.txt-c`              | Centers text horizontally
`.txt-t`              | Aligns text to the top
`.txt-b`              | Aligns text to the bottom
`.txt-m`              | Centers text vertically

*/
.txt-c, table .txt-c, table tr .txt-c, table tr td.txt-c {
  text-align: center; }

.txt-l, table .txt-l, table tr .txt-l, table tr td.txt-l {
  text-align: left; }

.txt-r, table .txt-r, table tr .txt-r, table tr td.txt-r {
  text-align: right; }

.txt-t, table .txt-t, table tr .txt-t, table tr td.txt-t {
  vertical-align: top; }

.txt-b, table .txt-b, table tr .txt-b, table tr td.txt-b {
  vertical-align: bottom; }

.txt-m, table .txt-m, table tr .txt-m, table tr td.txt-m {
  vertical-align: middle; }

.h1-login {
  color: #34928a;
  font-size: 23px;
  font-weight: 400;
  text-transform: none; }

.h2-login {
  color: #b3b3b3;
  font-weight: normal;
  font-size: 18px;
  text-transform: none; }

/*doc
---
title: Iconography
name: iconography
category: Base CSS
---

We use Font Awesome for scalable vector icons that can be customized — size, color, drop shadow,
and anything that can be done with CSS. These icons will always match the font color.


Button                                             | Class                  | Description
-------------------------------------------------- | ---------------------- | -----------
<i class="fa fa-plus"></i>                         | `.fa.fa-plus`          | Renders our plus icon
<i class="fa fa-user"></i>                         | `.fa.fa-user`          | Renders our person icon
<i class="fa fa-sort-down"></i>                    | `.fa.fa-sort-down`     | Renders our triangle icon
<i class="fa fa-cog"></i>                          | `.fa.fa-cog`           | Renders our gear icon
<i class="fa fa-times"></i>                        | `.fa.fa-times`         | Renders our 'x' icon
<i class="fa fa-check"></i>                        | `.fa.fa-check`         | Renders our check icon
<i class="fa fa-chevron-right"></i>                | `.fa.fa-chevron-right` | Renders our right chevron icon
<i class="fa fa-chevron-up"></i>                   | `.fa.fa-chevron-up`    | Renders our down chevron icon
<i class="fa fa-chevron-down"></i>                 | `.fa.fa-chevron-down`  | Renders our down chevron icon
<i class="fa fa-windows"></i>                      | `.fa.fa-windows`       | Renders our Windows icon
<i class="fa fa-apple"></i>                        | `.fa.fa-apple`         | Renders our Apple icon
<i class="fa fa-linux"></i>                        | `.fa.fa-linux`         | Renders our Linux icon

*/
/*doc
---
title: Buttons
name: button
category: Base CSS
---

Button styles can be applied to any element. Typically you'll want to
use either a `<button>` or an `<a>` element:

```haml_example
%button.btn.btn-primary Button
%a.btn.btn-primary{href: "http://trulia.com"} Link
```

If your button is actually a link to another page, please use the
`<a>` element, while if your button performs an action, such as submitting
a form or triggering some javascript event, then use a `<button>` element.

##Button Sizes
There are three 3 sizes for buttons: Large, medium (default)
and small. Simply apply the size modifier class for the desired size.
There is also an additional modifier that will make the button take the
full width of the container. It may be used with the any of the button
size and style modifiers.

Button                                                             | Modifier Class
------------------------------------------------------------------ | -----------------
<button class="btn btn-primary btn-xl">Extra Large</button>        | `btn btn-primary btn-xl`
<button class="btn btn-primary btn-lg">Large</button>              | `btn btn-primary btn-lg`
<button class="btn btn-primary">Default</button>                   | `btn btn-primary`
<button class="btn btn-primary btn-sm">Small</button>              | `btn btn-primary btn-sm`
*/
/*doc
---
title: Full width Buttons
name: full_width_button
parent: button
category: Base CSS
---

Create block level buttons—those that span the full width of a parent— by adding `.btn-block`.

```haml_example
%button.btn.btn-primary.btn-block Full width button
```

*/
.btn, .island-button, .forgot-password-button {
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .04em; }

.btn-xl {
  padding: 0 0;
  font-size: 23px;
  line-height: 2.48;
  border-radius: 6px;
  min-width: 306px; }

/*doc
---
parent: button
name: buttonSkins
title: Button Styles
---

Button                                                     | Disabled                                                   | Class              | Description
---------------------------------------------------------- | ---------------------------------------------------------- | ------------------ | -----------
<button class="btn btn-default">Default</button>           |<button class="btn btn-default" disabled>Default</button>   | `btn btn-default`  | This is what buttons look like, this is the go to button style.
<button class="btn btn-primary">Primary</button>           |<button class="btn btn-primary" disabled>Primary</button>   | `btn btn-primary`  | Use this button as the primary call to action
<button class="btn btn-lowlight">Lowlight</button>         |<button class="btn btn-lowlight" disabled>Lowlight</button> | `btn btn-lowlight` | Use this button for other actions, like cancel/dismiss
<button class="btn btn-danger">Delete</button>             |<button class="btn btn-danger" disabled>Delete</button>     | `btn btn-danger`   | This button is for delete actions, these actions should also have a confirmation dialog
*/
.btn-default {
  background-color: transparent;
  color: #49a8d5;
  font-size: 12px; }
  .btn-default:hover, .btn-default:active {
    box-shadow: 0 0 0 1px #d4d9da;
    background-color: #f8f8f8;
    color: #2780aa; }

.btn-primary {
  color: #f8f8f8;
  background-color: #49a8d5;
  border: none; }
  .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
    color: #f8f8f8;
    background-color: #18789e; }
  .open .btn-primary.dropdown-toggle {
    color: #f8f8f8;
    background-color: #18789e; }
  .btn-primary:active, .btn-primary.active {
    background-image: none; }
  .open .btn-primary.dropdown-toggle {
    background-image: none; }
  .btn-primary.disabled, .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled:active, .btn-primary.disabled.active, .btn-primary[disabled], .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled]:active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:active, fieldset[disabled] .btn-primary.active {
    background-color: #78868a;
    color: #d4d9da; }

.btn-lowlight {
  color: #f8f8f8;
  background-color: #9faaad;
  border: none; }
  .btn-lowlight:hover, .btn-lowlight:focus, .btn-lowlight:active, .btn-lowlight.active {
    color: #f8f8f8;
    background-color: #78868a; }
  .open .btn-lowlight.dropdown-toggle {
    color: #f8f8f8;
    background-color: #78868a; }
  .btn-lowlight:active, .btn-lowlight.active {
    background-image: none; }
  .open .btn-lowlight.dropdown-toggle {
    background-image: none; }
  .btn-lowlight.disabled, .btn-lowlight.disabled:hover, .btn-lowlight.disabled:focus, .btn-lowlight.disabled:active, .btn-lowlight.disabled.active, .btn-lowlight[disabled], .btn-lowlight[disabled]:hover, .btn-lowlight[disabled]:focus, .btn-lowlight[disabled]:active, .btn-lowlight[disabled].active, fieldset[disabled] .btn-lowlight, fieldset[disabled] .btn-lowlight:hover, fieldset[disabled] .btn-lowlight:focus, fieldset[disabled] .btn-lowlight:active, fieldset[disabled] .btn-lowlight.active {
    background-color: #78868a;
    color: #d4d9da; }

.btn-danger {
  color: #f8f8f8;
  background-color: #cb7171;
  border: none; }
  .btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active {
    color: #f8f8f8;
    background-color: #b94242; }
  .open .btn-danger.dropdown-toggle {
    color: #f8f8f8;
    background-color: #b94242; }
  .btn-danger:active, .btn-danger.active {
    background-image: none; }
  .open .btn-danger.dropdown-toggle {
    background-image: none; }
  .btn-danger.disabled, .btn-danger.disabled:hover, .btn-danger.disabled:focus, .btn-danger.disabled:active, .btn-danger.disabled.active, .btn-danger[disabled], .btn-danger[disabled]:hover, .btn-danger[disabled]:focus, .btn-danger[disabled]:active, .btn-danger[disabled].active, fieldset[disabled] .btn-danger, fieldset[disabled] .btn-danger:hover, fieldset[disabled] .btn-danger:focus, fieldset[disabled] .btn-danger:active, fieldset[disabled] .btn-danger.active {
    background-color: #78868a;
    color: #d4d9da; }

/*doc
---
title: Login Button
name: button_login
parent: button
category: Base CSS
---

There is a specific button style for the login pages:

```haml_example
  %button.btn.btn-alternate.btn-lg Alternate Button
```

Do not use this button on normal application pages.

*/
.btn-alternate, .island-button, .forgot-password-button {
  color: #eeeeee;
  background-color: #1b92cb;
  background: #2281bc;
  box-shadow: 0 2px 0 #196084;
  border: 0 0 2px 0;
  color: white;
  font-weight: normal;
  text-transform: none; }
  .btn-alternate:hover, .island-button:hover, .forgot-password-button:hover, .btn-alternate:focus, .island-button:focus, .forgot-password-button:focus, .btn-alternate:active, .island-button:active, .forgot-password-button:active, .btn-alternate.active, .active.island-button, .active.forgot-password-button {
    color: #eeeeee;
    background-color: #1675a2; }
  .open .btn-alternate.dropdown-toggle, .open .dropdown-toggle.island-button, .open .dropdown-toggle.forgot-password-button {
    color: #eeeeee;
    background-color: #1678a7; }
  .btn-alternate:active, .island-button:active, .forgot-password-button:active, .btn-alternate.active, .active.island-button, .active.forgot-password-button {
    background-image: none; }
  .open .btn-alternate.dropdown-toggle, .open .dropdown-toggle.island-button, .open .dropdown-toggle.forgot-password-button {
    background-image: none; }
  .btn-alternate.disabled, .disabled.island-button, .disabled.forgot-password-button, .btn-alternate.disabled:hover, .disabled.island-button:hover, .disabled.forgot-password-button:hover, .btn-alternate.disabled:focus, .disabled.island-button:focus, .disabled.forgot-password-button:focus, .btn-alternate.disabled:active, .disabled.island-button:active, .disabled.forgot-password-button:active, .btn-alternate.disabled.active, .disabled.active.island-button, .disabled.active.forgot-password-button, .btn-alternate[disabled], [disabled].island-button, [disabled].forgot-password-button, .btn-alternate[disabled]:hover, [disabled].island-button:hover, [disabled].forgot-password-button:hover, .btn-alternate[disabled]:focus, [disabled].island-button:focus, [disabled].forgot-password-button:focus, .btn-alternate[disabled]:active, [disabled].island-button:active, [disabled].forgot-password-button:active, .btn-alternate[disabled].active, [disabled].active.island-button, [disabled].active.forgot-password-button, fieldset[disabled] .btn-alternate, fieldset[disabled] .island-button, fieldset[disabled] .forgot-password-button, fieldset[disabled] .btn-alternate:hover, fieldset[disabled] .island-button:hover, fieldset[disabled] .forgot-password-button:hover, fieldset[disabled] .btn-alternate:focus, fieldset[disabled] .island-button:focus, fieldset[disabled] .forgot-password-button:focus, fieldset[disabled] .btn-alternate:active, fieldset[disabled] .island-button:active, fieldset[disabled] .forgot-password-button:active, fieldset[disabled] .btn-alternate.active, fieldset[disabled] .active.island-button, fieldset[disabled] .active.forgot-password-button {
    background-color: #1b92cb; }

.btn-lg, .btn-group-lg > .btn, .btn-group-lg > .island-button, .btn-group-lg > .forgot-password-button, .island-button, .forgot-password-button {
  padding: 10px 26px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 3px; }

/*doc
---
title: Links
name: link
category: Base CSS
---

There are four different kinds of links you can use to connect related content. In most cases (unless the designer specifically asks for another type of link) you should choose the default link.

```haml_example
%a{href: "http://google.com"}
  %i.fa.fa-plus
  link with an icon
```

Link                                                                      | Class              | Description
------------------------------------------------------------------------- | ------------------ | -----------
<a href="http://google.com">default link</a>                                     |                    | This is what buttons look like, this is the go to button style.
<a class="link-highlight" href="http://google.com">highlight link</a>            | `link-highlight`   | Use this button as the primary call to action
<a class="link-lowlight" href="http://google.com">lowlight link</a>              | `link-lowlight`    | I'm afraid I can't let you do that, yet.
<span class="bkg-primary-3 phs pvs"><a class="link-inverse" href="http://google.com">inverse link</a></span> | `link-inverse`    | I go on a non-white background
<a href="http://google.com"><i class="fa fa-plus"></i> link with an icon </a>     |                    | This button is for delete actions, these actions should also have a confirmation dialog
*/
a:hover {
  text-decoration: none; }

.link-highlight {
  color: #34928a; }
  .link-highlight:hover {
    color: #2780aa; }

.link-lowlight {
  color: #414141; }
  .link-lowlight:hover {
    color: #1b1b1b;
    text-decoration: underline; }

.link-inverse {
  color: #f8f8f8; }
  .link-inverse:hover {
    color: #72b5ad; }

/*doc
---
title: Media
name: media
category: Base CSS
---

The default media allow to float a media object (images, video, audio) to the left or right of a content block.

```haml_example
.media
  %a.pull-left{:href => "#"}
    %img.media-object{:alt => "...", :src => "http://placehold.it/64x64"}
  .media-body
    %h4.media-heading Media heading
    %p
      Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
```

Wrap the image in a fixed-size `.image-container` to make sure the image isn't
larger than the container

```haml_example
.media
  %a.pull-left{:href => "#"}
    .image-container{style: "width: 100px; height: 50px;"}
      %img.media-object{:alt => "...", :src => "http://placehold.it/64x64"}
  .media-body
    %h4.media-heading Media heading
    %p
      Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
```
*/
.media .image-container .media-object {
  margin: auto;
  max-height: 100%;
  max-width: 100%; }


/*doc
---
title: Panels
name: panel
category: Base CSS
---

Panels are often used to group related content. They include box headers, footers, and can be combined with any backgrounds.

Panels are typically a combination of contours, backgrounds, and content including headers and footers.

Panels                  | Modifier Class
----------------------- | -----------------
panel-simple            | `panel panel-simple`
panel-tile              | `panel panel-tile`


*/
.panel {
  box-shadow: none; }
  .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 {
    margin: 0; }

.boxBgBasic {
  background-color: #eee; }

.boxDefault {
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  border: none; }

.box .boxHeadBranded {
  background: #64aea8;
  text-transform: uppercase;
  font-weight: 300;
  font-size: 24px;
  color: #eee;
  padding: 21px 0 10px 87px;
  position: relative; }
  .box .boxHeadBranded:before {
    content: "";
    display: block;
    background: #00776d url('/images/p-logo.png') no-repeat center center;
    height: 100%;
    min-width: 65px;
    position: absolute;
    top: 0;
    left: 0; }

/*doc
---
title: Dividers
name: divider
category: Base CSS
---

Dividers draw horizontal lines between different content groupings.

```haml_example
%hr.divider-simple
```

```haml_example
%hr.divider-lowlight
```

*/

/*doc
---
title: Dropdown
name: dropdown
category: Base CSS
---

Dropdowns are the basic bootstrap dropdowns. Whenever possible use the browser
default dropdowns in the forms section. They are more naturally compatible with mobile.

```haml_example
.dropdown
  %a#triggerId{"data-target" => "#", "data-toggle" => "dropdown", :href => "#", :role => "button"}
    Dropdown
    %span.caret
  %ul.dropdown-menu{"aria-labelledby" => "triggerId", :role => "menu"}
    %li
      %a foo
    %li
      %a bar
```

*/
.dropdown .caret {
  border-top-color: initial; }

/*doc
---
title: Lists
name: lists
category: Base CSS
---
*/

/*doc
---
title: List Group
name: list-group
parent: lists
category: Base CSS
---

Use this list when you need simple gray borders between items

```haml_example
%ul.list-group
  %li.list-group-item
    item 1
  %li.list-group-item
    item 2
  %li.list-group-item
    item 3
```
*/
.list-group, .list-group > li {
  border-width: 1px 0; }

.list-group-item {
  background-color: transparent;
  padding-right: 0; }

/*doc
---
title: List Spacing
name: list-whitespace
parent: lists
category: Base CSS
---

Most lists come with built in default spacing that should work for you. However, if you find yourself needing to modify the spacing, you should do that with list spacing classes rather than whitespace classes. A single class can be applied to the list and all direct children will be modified.
The classes are constructed by specifying `<type><location><size>`.

<table>
    <tbody><tr>
      <th scope="col" colspan="3" class="txtL"><strong>Type:</strong></th>
    </tr>
    <tr>
      <th scope="row"><code>l</code></th>
      <td>list</td>
      <td>Space on the inside of each of the li direct children of the element</td>
    </tr>
    <tr>
      <th scope="col" colspan="3" class="txtL"><strong>Location:</strong></th>
    </tr>
    <tr>
      <th scope="row"><code>h</code></th>
      <td>horizontal</td>
      <td>Adds spacing to the left and right of the <code>li</code>.</td>
    </tr>
    <tr>
      <th scope="row"><code>v</code></th>
      <td>vertical</td>
      <td>Adds spacing to the top and bottom of the <code>li</code>.</td>
    </tr>
    <tr>
      <th scope="col" colspan="3" class="txtL"><strong>Size:</strong></th>
    </tr>
    <tr>
      <th scope="row"><code>xl</code></th>
      <td>extra large</td>
      <td>Adds 21 pixels of space</td>
    </tr>
    <tr>
      <th scope="row"><code>l</code></th>
      <td>large</td>
      <td>Adds 10 pixels of space</td>
    </tr>
    <tr>
      <th scope="row"><code>m</code></th>
      <td>medium</td>
      <td>Adds 7 pixels of space</td>
    </tr>
    <tr>
      <th scope="row"><code>s</code></th>
      <td>small</td>
      <td>Adds 5 pixels of space</td>
    </tr>
    <tr>
      <th scope="row"><code>n</code></th>
      <td>none</td>
      <td>Sets any existing space to 0</td>
    </tr>
  </tbody></table>

<div class="row">
  <div class="col-md-12">

  </div>
  <div class="col-md-12">

  </div>
</div>

#### Vertical Spacing Options

##### None

```haml_example
%ul.lvn
  %li
    feep
  %li
    fop
  %li
    meep
```

##### Small

```haml_example
%ul.lvs
  %li
    feep
  %li
    fop
  %li
    meep
```

##### Medium

```haml_example
%ul.lvm
  %li
    feep
  %li
    fop
  %li
    meep
```

##### Large

```haml_example
%ul.lvl
  %li
    feep
  %li
    fop
  %li
    meep
```

#### Horizontal Spacing Options

##### None

```haml_example
%ul.list-inline.lhn
  %li
    feep
  %li
    fop
  %li
    meep
```

##### Small

```haml_example
%ul.list-inline.lhs
  %li
    feep
  %li
    fop
  %li
    meep
```

##### Medium

```haml_example
%ul.list-inline.lhm
  %li
    feep
  %li
    fop
  %li
    meep
```

##### Large

```haml_example
%ul.list-inline.lhl
  %li
    feep
  %li
    fop
  %li
    meep
```

*/
/* build list spacing exceptions */
.lvn > li {
  padding-top: 0 !important;
  padding-bottom: 0 !important; }

.lvs > li {
  padding-top: 5px !important;
  padding-bottom: 5px !important; }

.lvm > li {
  padding-top: 10px !important;
  padding-bottom: 10px !important; }

.lvl > li {
  padding-top: 20px !important;
  padding-bottom: 20px !important; }

.lhn > li {
  padding-left: 0 !important;
  padding-right: 0 !important; }

.lhs > li {
  padding-left: 5px !important;
  padding-right: 5px !important; }

.lhm > li {
  padding-left: 10px !important;
  padding-right: 10px !important; }

.lhl > li {
  padding-left: 20px !important;
  padding-right: 20px !important; }

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

html {
  background-color: white; }

html, body {
  padding: 0;
  margin: 0;
  height: 100%;
  font-size: 15px; }

.page-wrapper {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  min-height: 100%; }
  .page-wrapper .page-body {
    flex: 1; }

.footer-login {
  padding: 13px 85px;
  width: 100%;
  background: #3b3c41;
  color: #ededed; }

.page-wrap-login {
  overflow: auto;
  min-height: 100%;
  margin-bottom: -46px; }

.page-wrap-login:after {
  content: "";
  display: block; }

.footer-login, .page-wrap-login:after {
  height: 46px; }

.page-login {
  width: 550px;
  margin: 100px auto 0 auto; }

/*doc
---
title: Whitespace
name: whitespace
category: Base CSS
---

Should be used to modify the default spacing between objects (not between nodes of the same object)
Please use judiciously. You want to be using defaults most of the time, these are exceptions!
`<type><location><size>`

Letter                           | Description
-------------------------------- | ------------------------------------------------------------------
p, m                             | padding, margin
a, t, r, b, l, h, v              | all, top, right, bottom, left, horizontal, vertical
n, s, m, l, xl, xxl, xxxl, xxxxl | none(0px), small(5px), medium(7px), large(10px), extra large(20px), extra extra large (40px), extra extra extra large (120px), extra extra extra extra large (140px)


```haml_example
%p A normal paragraph
%p.pal A paragraph with large padding
```


*/
.pan {
  padding: 0 !important; }

.man {
  margin: 0 !important; }

.pvn {
  padding-top: 0 !important;
  padding-bottom: 0 !important; }

.mvn {
  margin-top: 0 !important;
  margin-bottom: 0 !important; }

.phn {
  padding-left: 0 !important;
  padding-right: 0 !important; }

.mhn {
  margin-left: 0 !important;
  margin-right: 0 !important; }

.ptn {
  padding-top: 0 !important; }

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

.prn {
  padding-right: 0 !important; }

.mrn {
  margin-right: 0 !important; }

.pbn {
  padding-bottom: 0 !important; }

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

.pln {
  padding-left: 0 !important; }

.mln {
  margin-left: 0 !important; }

.pas {
  padding: 5px !important; }

.mas {
  margin: 5px !important; }

.pvs {
  padding-top: 5px !important;
  padding-bottom: 5px !important; }

.mvs {
  margin-top: 5px !important;
  margin-bottom: 5px !important; }

.phs {
  padding-left: 5px !important;
  padding-right: 5px !important; }

.mhs {
  margin-left: 5px !important;
  margin-right: 5px !important; }

.pts {
  padding-top: 5px !important; }

.mts {
  margin-top: 5px !important; }

.prs {
  padding-right: 5px !important; }

.mrs {
  margin-right: 5px !important; }

.pbs {
  padding-bottom: 5px !important; }

.mbs {
  margin-bottom: 5px !important; }

.pls {
  padding-left: 5px !important; }

.mls {
  margin-left: 5px !important; }

.pam {
  padding: 7px !important; }

.mam {
  margin: 7px !important; }

.pvm {
  padding-top: 7px !important;
  padding-bottom: 7px !important; }

.mvm {
  margin-top: 7px !important;
  margin-bottom: 7px !important; }

.phm {
  padding-left: 7px !important;
  padding-right: 7px !important; }

.mhm {
  margin-left: 7px !important;
  margin-right: 7px !important; }

.ptm {
  padding-top: 7px !important; }

.mtm {
  margin-top: 7px !important; }

.prm {
  padding-right: 7px !important; }

.mrm {
  margin-right: 7px !important; }

.pbm {
  padding-bottom: 7px !important; }

.mbm {
  margin-bottom: 7px !important; }

.plm {
  padding-left: 7px !important; }

.mlm {
  margin-left: 7px !important; }

.pal {
  padding: 10px !important; }

.mal {
  margin: 10px !important; }

.pvl {
  padding-top: 10px !important;
  padding-bottom: 10px !important; }

.mvl {
  margin-top: 10px !important;
  margin-bottom: 10px !important; }

.phl {
  padding-left: 10px !important;
  padding-right: 10px !important; }

.mhl {
  margin-left: 10px !important;
  margin-right: 10px !important; }

.ptl {
  padding-top: 10px !important; }

.mtl {
  margin-top: 10px !important; }

.prl {
  padding-right: 10px !important; }

.mrl {
  margin-right: 10px !important; }

.pbl {
  padding-bottom: 10px !important; }

.mbl {
  margin-bottom: 10px !important; }

.pll {
  padding-left: 10px !important; }

.mll {
  margin-left: 10px !important; }

.paxl {
  padding: 20px !important; }

.maxl {
  margin: 20px !important; }

.pvxl {
  padding-top: 20px !important;
  padding-bottom: 20px !important; }

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

.phxl {
  padding-left: 20px !important;
  padding-right: 20px !important; }

.mhxl {
  margin-left: 20px !important;
  margin-right: 20px !important; }

.ptxl {
  padding-top: 20px !important; }

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

.prxl {
  padding-right: 20px !important; }

.mrxl {
  margin-right: 20px !important; }

.pbxl {
  padding-bottom: 20px !important; }

.mbxl {
  margin-bottom: 20px !important; }

.plxl {
  padding-left: 20px !important; }

.mlxl {
  margin-left: 20px !important; }

.paxxl {
  padding: 40px !important; }

.maxxl {
  margin: 40px !important; }

.pvxxl {
  padding-top: 40px !important;
  padding-bottom: 40px !important; }

.mvxxl {
  margin-top: 40px !important;
  margin-bottom: 40px !important; }

.phxxl {
  padding-left: 40px !important;
  padding-right: 40px !important; }

.mhxxl {
  margin-left: 40px !important;
  margin-right: 40px !important; }

.ptxxl {
  padding-top: 40px !important; }

.mtxxl {
  margin-top: 40px !important; }

.prxxl {
  padding-right: 40px !important; }

.mrxxl {
  margin-right: 40px !important; }

.pbxxl {
  padding-bottom: 40px !important; }

.mbxxl {
  margin-bottom: 40px !important; }

.plxxl {
  padding-left: 40px !important; }

.mlxxl {
  margin-left: 40px !important; }

.paxxxl {
  padding: 120px !important; }

.maxxxl {
  margin: 120px !important; }

.pvxxxl {
  padding-top: 120px !important;
  padding-bottom: 120px !important; }

.mvxxxl {
  margin-top: 120px !important;
  margin-bottom: 120px !important; }

.phxxxl {
  padding-left: 120px !important;
  padding-right: 120px !important; }

.mhxxxl {
  margin-left: 120px !important;
  margin-right: 120px !important; }

.ptxxxl {
  padding-top: 120px !important; }

.mtxxxl {
  margin-top: 120px !important; }

.prxxxl {
  padding-right: 120px !important; }

.mrxxxl {
  margin-right: 120px !important; }

.pbxxxl {
  padding-bottom: 120px !important; }

.mbxxxl {
  margin-bottom: 120px !important; }

.plxxxl {
  padding-left: 120px !important; }

.mlxxxl {
  margin-left: 120px !important; }

.paxxxxl {
  padding: 140px !important; }

.maxxxxl {
  margin: 140px !important; }

.pvxxxxl {
  padding-top: 140px !important;
  padding-bottom: 140px !important; }

.mvxxxxl {
  margin-top: 140px !important;
  margin-bottom: 140px !important; }

.phxxxxl {
  padding-left: 140px !important;
  padding-right: 140px !important; }

.mhxxxxl {
  margin-left: 140px !important;
  margin-right: 140px !important; }

.ptxxxxl {
  padding-top: 140px !important; }

.mtxxxxl {
  margin-top: 140px !important; }

.prxxxxl {
  padding-right: 140px !important; }

.mrxxxxl {
  margin-right: 140px !important; }

.pbxxxxl {
  padding-bottom: 140px !important; }

.mbxxxxl {
  margin-bottom: 140px !important; }

.plxxxxl {
  padding-left: 140px !important; }

.mlxxxxl {
  margin-left: 140px !important; }

/*doc
---
title: Navigation
name: navigation
category: Base CSS
---


*/

.headers {
  margin-bottom: 20px; }
  .headers .nav-list-wrapper {
    background-color: #f8f8f8; }
  .headers .nav-list {
    text-align: right;
    margin: 0; }
    .headers .nav-list a {
      color: #72b5ad;
      padding: 5px 8px;
      display: inline-block; }
      .headers .nav-list a:hover, .headers .nav-list a:active {
        color: #02786e; }
  .headers .navbar-brand {
    font-size: 17px;
    font-weight: 200; }
    .headers .navbar-brand .image-logo {
      width: 177px;
      height: 50px;
      margin-right: 10px;
      display: inline-block;
      vertical-align: middle;
      background-position: top left;
      background-repeat: no-repeat;
      background-image: url('/images/logo-pws.png'); }
      .on_premise .headers .navbar-brand .image-logo {
        background-image: url('/images/logo-pcf.png'); }
    .headers .navbar-brand strong {
      display: block;
      margin-left: 2px;
      font-size: 18px;
      font-weight: 600; }
    .on_premise .headers .navbar-brand strong {
      display: inline; }
  .headers .navbar-list-divider {
    text-align: right;
    font-size: 0;
    margin-top: 18px; }
    .headers .navbar-list-divider > li {
      font-size: 15px;
      display: inline-block;
      border-left: 1px solid #72b5ad;
      min-height: 43px;
      padding-left: 18px;
      margin-left: 18px; }
      .headers .navbar-list-divider > li:first-child {
        border: none;
        padding-left: 0;
        margin-left: 0; }
  .headers .navbar-nav {
    margin-left: 0;
    margin-right: 0; }
    .headers .navbar-nav > li > a {
      padding-top: 11px;
      padding-bottom: 12px; }
  .headers .dropdown-nav {
    margin-right: 10px;
    width: 250px; }
    .headers .dropdown-nav .dropdown-toggle .org-name {
      display: block;
      white-space: nowrap;
      overflow: hidden;
      -ms-text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      text-overflow: ellipsis; }
    .headers .dropdown-nav .dropdown-toggle .user-email {
      display: inline-block;
      width: 200px;
      white-space: nowrap;
      overflow: hidden;
      -ms-text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      text-overflow: ellipsis; }
    .headers .dropdown-nav .dropdown-toggle .caret {
      float: right; }
    .headers .dropdown-nav.open .dropdown-toggle {
      background-color: #015952 !important;
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 0; }
    .headers .dropdown-nav.open .dropdown-menu {
      width: auto !important;
      border-top: none;
      text-align: left;
      right: 2px;
      left: 2px;
      box-shadow: none;
      border-radius: 0; }
      .headers .dropdown-nav.open .dropdown-menu li.divider {
        background-color: #015952;
        margin-left: 13px;
        margin-right: 13px; }
      .headers .dropdown-nav.open .dropdown-menu li a {
        color: #34928a;
        padding-left: 13px;
        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis; }
      .headers .dropdown-nav.open .dropdown-menu li.item-organization a {
        color: #9faaad; }
    .headers .dropdown-nav .dropdown-toggle {
      color: #f8f8f8 !important;
      text-align: left;
      font-size: 15px;
      padding: 5px 10px;
      margin: 6px 2px 0 2px;
      border-radius: 3px;
      background-color: #02786e !important; }
      .headers .dropdown-nav .dropdown-toggle .caret {
        border-top-color: #72b5ad !important;
        border-bottom-color: #72b5ad !important;
        float: right;
        margin-top: 8px; }
  .headers .navbar-main > li > a {
    text-transform: uppercase; }
  .headers .navbar-main .active:after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -27px;
    border-style: solid;
    border-width: 21px 28px 0 28px;
    border-color: #34928a transparent transparent transparent; }
  .headers .dropdown-nav-secondary {
    width: auto; }
    .headers .dropdown-nav-secondary a.dropdown-toggle {
      color: #f8f8f8 !important;
      font-weight: 200;
      text-transform: uppercase;
      font-size: 13px;
      white-space: nowrap;
      overflow: hidden;
      -ms-text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      text-overflow: ellipsis;
      background-color: transparent !important; }
      .headers .dropdown-nav-secondary a.dropdown-toggle .fa-user {
        font-size: 18px;
        margin-right: 5px; }
      .headers .dropdown-nav-secondary a.dropdown-toggle .caret {
        border-top-color: #f8f8f8 !important;
        border-bottom-color: #f8f8f8 !important; }
      .headers .dropdown-nav-secondary a.dropdown-toggle .user-email {
        vertical-align: middle;
        padding-right: 7px; }
    .headers .dropdown-nav-secondary.open a.dropdown-toggle {
      background-color: red; }
  .headers .navbar-signin {
    color: #f8f8f8; }
    .headers .navbar-signin a {
      display: inline-block;
      color: #f8f8f8; }
  .headers .subnav {
    background-color: #ededed;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 20px 20px 10px 20px; }
  @media (min-width: 768px) {
    .headers .navbar-collapse.in {
      overflow-y: visible; } }
  @media all and (max-width: 1200px) {
    .headers .dropdown-nav-secondary.open .dropdown-menu {
      left: auto; } }
  @media all and (max-width: 1200px) and (min-width: 768px) {
    .headers .dropdown-nav-secondary a.dropdown-toggle {
      width: 47px; }
      .headers .dropdown-nav-secondary a.dropdown-toggle .user-email {
        display: none; } }
  @media all and (max-width: 992px) and (min-width: 768px) {
    .headers .dropdown-nav-secondary .dropdown-menu {
      left: -111px; } }
  @media all and (max-width: 990px) {
    .headers .navbar-list-divider > li {
      padding-left: 8px;
      margin-left: 8px; }
    .headers .dropdown-nav {
      width: 100px; }
    .headers .dropdown-nav-secondary {
      width: auto; } }
  @media all and (max-width: 766px) {
    .headers .navbar-list-divider {
      text-align: left; }
      .headers .navbar-list-divider > li {
        border-left-width: 0;
        border-top: 1px solid #72b5ad;
        display: block;
        padding-left: 0;
        margin-left: 0; }
    .headers .dropdown-nav {
      width: auto;
      margin: 11px 10px 12px 10px; }
      .headers .dropdown-nav .dropdown-toggle .user-email {
        width: auto; }
      .headers .dropdown-nav.open .dropdown-menu {
        background-color: #fff;
        margin-right: 2px;
        margin-left: 2px; }
        .headers .dropdown-nav.open .dropdown-menu li a:focus, .headers .dropdown-nav.open .dropdown-menu li a:hover {
          color: #34928a; } }
  @media (max-width: 768px) {
    .headers .container-subnav {
      padding: 0; }
      .headers .container-subnav .subnav {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
        padding: 10px; } }

/*doc
---
title: Inputs & Labels
name: input
parent: form
category: Base CSS
---

An input with the label top aligned (this is the default layout).

```haml_example
%form.styleguide-form{:role => "form"}
  .form-group
    %label{:for => "exampleInputEmail1"}
      %abbr{:title => "required"} *
      Email address
    %input#exampleInputEmail1.form-control{:placeholder => "Enter email", :type => "email", :required => "required", 'aria-required' => "true"}
```

Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal
layout by adding `.form-horizontal` to the form. Doing so changes `.form-groups` to behave as grid rows, so no need for `.row`.

An input with the label left aligned

```haml_example
%form.styleguide-form.form-horizontal{:role => "form"}
  .form-group
    .col-md-6
      %label.control-label{:for => "exampleInputEmail1"}
        %abbr{:title => "required"} *
        Email address
    .col-md-18
      %input#exampleInputEmail1.form-control{:placeholder => "Enter email", :type => "email", :required => "required", 'aria-required' => "true"}
```

An input with the label right aligned (N.B., control-label class provides the right alignment):

```haml_example
%form.styleguide-form.form-horizontal{:role => "form"}
  .form-group
    %label.col-md-6.control-label{:for => "exampleInputEmail1"}
      %abbr{:title => "required"} *
      Email address
    .col-md-18
      %input#exampleInputEmail1.form-control{:placeholder => "Enter email", :type => "email", :required => "required", 'aria-required' => "true"}
```
*/
.form-group abbr {
  float: right;
  margin-left: 5px;
  border-bottom: 0; }
.form-group [class*="col"].control-label abbr {
  float: none;
  margin-right: 2px; }

label {
  font-weight: 400; }

::-webkit-input-placeholder {
  font-weight: 200; }

:-moz-placeholder {
  /* Firefox 18- */
  font-weight: 200; }

::-moz-placeholder {
  /* Firefox 19+ */
  font-weight: 200; }

:-ms-input-placeholder {
  font-weight: 200; }

/*doc
---
title: Checkboxes & Radios
name: Checkboxes
parent: form
category: Base CSS
---
Checkboxes are for selecting one or several options in a list while radios are for selecting one option from many.

### Default (stacked)

```haml_example
%form.styleguide-form{:role => "form"}
  .checkbox
    %label
      %input{:type => "checkbox", :value => ""}
        Option one is this and that&mdash;be sure to include why it's great
  .radio
    %label
      %input#optionsRadios1{:checked => "", :name => "optionsRadios", :type => "radio", :value => "option1"}
        Option one is this and that&mdash;be sure to include why it's great
  .radio
    %label
      %input#optionsRadios2{:name => "optionsRadios", :type => "radio", :value => "option2"}
        Option two can be something else and selecting it will deselect option one
```

### Inline checkboxes

Use `.checkbox-inline` or `.radio-inline` class to a series of checkboxes or radios for controls appear on the same line.

```haml_example
%form.styleguide-form{:role => "form"}
  .form-group
    %label.checkbox-inline
      %input#inlineCheckbox1{:type => "checkbox", :value => "option1"}
        1
    %label.checkbox-inline
      %input#inlineCheckbox2{:type => "checkbox", :value => "option2"}
        2
    %label.checkbox-inline
      %input#inlineCheckbox3{:type => "checkbox", :value => "option3"}
        3

  .form-group
    %label.radio-inline
      %input#inlineradio1{:type => "radio", :value => "option1"}
        1
    %label.radio-inline
      %input#inlineradio2{:type => "radio", :value => "option2"}
        2
    %label.radio-inline
      %input#inlineradio3{:type => "radio", :value => "option3"}
        3
```

*/
input[type="radio"] {
  margin-top: 2px; }

/*doc
---
title: HTML5 controls
name: html5_controls
parent: form
category: Base CSS
---

Examples of standard form controls supported in an example form layout.

Inputs
Most common form control, text-based input fields. Includes support for
all HTML5 types: `text`, `password`, `datetime`, `datetime-local`,
`date`, `month`, `time`, `week`, `number`, `email`, `url`, `search`,
`tel`, and `color`.

<div class="alert alert-warning">
  <h2 class="mtn">Type declaration required</h2>
  Inputs will only be fully styled if their type is properly declared.
</div>

```haml_example
%form.styleguide-form{:role => "form"}
  %input.form-control{:placeholder => "Text input", :type => "text"}
```

Password field

```haml_example
%form.styleguide-form{:role => "form"}
  %input.form-control{:placeholder => "Password", :type => "password"}
```

Date

```haml_example
%form.styleguide-form{:role => "form"}
  %input.form-control{:placeholder => "Date", :type => "date"}
```

Number

```haml_example
%form.styleguide-form{:role => "form"}
  %input.form-control{:placeholder => "Number", :type => "number"}
```

With a min/max and default starting value

```haml_example
%form.styleguide-form{:role => "form"}
  %input.form-control{:placeholder => "Number", :type => "number", min: 0, max: 2, value: 1}
```

With a different increment value

```haml_example

/*doc
---
title: Control states
name: validation
parent: form
category: Base CSS
---

### Validation

Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add `.has-warning`, `.has-error`, or `.has-success` to the parent element. Any `.control-label`, `.form-control`, and `.help-block` within that element will receive the validation styles.

```haml_example
%form.styleguide-form{:role => "form"}
  .form-group.has-success
    %label.control-label{:for => "inputSuccess"} Input with success
    %input#inputSuccess.form-control{:type => "text"}

  .form-group.has-warning
    %label.control-label{:for => "inputWarning"} Input with warning
    %input#inputWarning.form-control{:type => "text"}

  .form-group.has-error
    %label.control-label{:for => "inputError"} Input with error
    %input#inputError.form-control{:type => "text"}
    %span.help-block.has-error Error help text

  .form-group.has-error
    .checkbox
      %label.control-label
        %input{:type => "checkbox", :value => ""}
          Checkbox which needs to be checked
      %span.help-block.has-error Error help text
```
*/
/* overrides bootstrap colors */
.has-success {
  position: relative; }
  .has-success:before {
    content: "\f00c";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    height: 40px;
    width: 40px;
    line-height: 40px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    background-color: #74af7e;
    color: #f8f8f8;
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    text-align: center; }
  .has-success .control-label {
    color: #9faaad; }

.has-error input[type="checkbox"] {
  outline: 1px solid #b94242; }
.has-error .control-label {
  color: #9faaad; }

.has-warning .control-label {
  color: #9faaad; }

/*
---
title: Disabled Inputs
name: disabled
parent: validation
category: Base CSS
---
### Disabled Inputs

Inputs will occasionally need to be disabled. You can do that by adding the `disabled` attribute. Selects, checkboxes, fieldsets, buttons, and other form controls can all be disabled.

```haml_example
%input#disabledInput.form-control{:disabled => "", :placeholder => "Disabled input here...", :type => "text"}
```

*/
.form-control:focus {
  box-shadow: none; }

/*doc
---
title: Modals
name: modal
category: Base CSS
---

Modals do something worthwhile....
...
...

```haml_example
.modal.modal-basic.fade
  .modal-dialog
    .modal-content
      .modal-header
        %h3.modal-title Modal title
      .modal-body
        %p One fine body…
      .modal-footer
        %button.btn.btn-lowlight{"data-dismiss" => "modal", type: "button"} Cancel
        %button.btn.btn-primary{type: "button"} OK
```

## Live demo

<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade modal-basic" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-lowlight" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>
*/
.modal.modal-basic .modal-dialog {
  padding-top: 200px; }
.modal.modal-basic .modal-content {
  border-radius: 0;
  border-width: 2px; }
.modal.modal-basic .modal-header {
  background-color: #34928a;
  padding: 10px; }
  .modal.modal-basic .modal-header .modal-title {
    color: #f8f8f8; }
.modal.modal-basic .modal-footer {
  padding: 10px;
  background-color: #d4d9da;
  text-align: center; }

.modal-backdrop.in {
  opacity: 0.75;
  filter: alpha(opacity=75); }

.alert {
  margin: 1.5 0; }
  .alert .close {
    text-decoration: none;
    line-height: .7;
    text-shadow: none; }

.alert-error {
  background-color: #cb7171;
  border-color: #b94242;
  color: #f8f8f8; }
  .alert-error hr {
    border-top-color: #a63b3b; }
  .alert-error .alert-link {
    color: #dfdfdf; }

/*doc
---
title: Banners
name: banner
category: Base CSS
---

You can use a banner to let the team know which environment they're
working on. Leave off the `.banner-styleguide-wrapper` div when using it
in other contexts.

```haml_example
.banner-styleguide-wrapper
  .banner
    Acceptance
```

*/
.banner {
  background: #a81500;
  /* Old browsers */
  background: -moz-linear-gradient(top, #a81500 0%, #9b1200 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a81500), color-stop(100%, #9b1200));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #a81500 0%, #9b1200 100%);
  /* Chrome10+,Safari5.1+ */
  background: -ms-linear-gradient(top, #a81500 0%, #9b1200 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #a81500 0%, #9b1200 100%);
  /* W3C */
  color: white;
  padding: 5px 55px;
  text-align: center;
  font-size: 16px;
  font-weight: 200;
  position: fixed;
  box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.2);
  top: 109px;
  left: -23px;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  z-index: 10000; }
  .banner:before {
    content: "";
    top: 2px;
    bottom: 2px;
    right: 2px;
    left: 2px;
    position: absolute;
    border: 1px dashed #c07074; }

/*doc
---
title: Editable
name: editable
category: Base CSS
---

Use this class for sections that can switch into an 'edit' mode.

```haml_example
.editable{data: {behavior: 'Editable'}}
  .panel.editable-show
    I'm viewing...
    %a.btn.btn-default{data: {editable: 'toggle', target: 'edit'}} Edit
  .panel.editable-edit
    I'm editing...
    %a.btn.btn-default{data: {editable: 'toggle', target: 'show'}} Cancel
```

*/
.editable .editable-show {
  display: block; }
.editable .editable-edit {
  display: none; }
.editable.edit .editable-show {
  display: none; }
.editable.edit .editable-edit {
  display: block; }

body {
  background-color: #f8f8f8; }

.header {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  height: 168px;
  background-size: contain; }

.header-image {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  height: 125px;
  width: 280px;
  margin: auto;
}

.content {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -40px;
    padding-top: 16px; }

.footer, .footer-spacer {
  height: 40px; }

.footer {
  text-align: center;
  color: #9faaad;
  font-size: 12px; }

h1 {
  font-size: 32px;
  font-weight: 300;
  line-height: 1em;
  text-transform: none;
  margin-top: 0;
  margin-bottom: 16px; }

h2 {
  font-size: 24px;
  font-weight: 300;
  color: #939393; }

.island {
  position: relative;
  text-align: center; }
.island .island-content {
  width: 216px;
  margin: 0 auto;
}
.island .island-content .alert {
  text-align: center;
}

.island-landscape {
  border: 1px solid #e0e4e5;
  margin-left: auto;
  margin-right: auto;
  max-width: 700px;
  padding: 40px;
  position: relative;
  width: 88%; }

.island-landscape:before, .island-landscape:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }
.island-landscape:after {
  clear: both; }
.island-landscape .island-title {
  float: left;
  width: 300px; }
.island-landscape .island-title p {
  font-weight: 300; }
.island-landscape .island-title p strong {
  font-weight: 400; }
.island-landscape .island-content {
  float: right;
  width: 230px;
  margin: 0 auto; }
.island-landscape .island-content .fa-envelope-o {
  float: left;
  font-size: 42px;
  width: 25%; }
.island-landscape .island-content .instructions-sent {
  float: right;
  width: 75%; }
.island-landscape .island-content .island-button, .island-landscape .island-content .forgot-password-button {
  clear: both; }
.island, .island-landscape {
    margin-top: 17px; }

@media (max-width: 720px) {
.island-landscape {
  border: none;
  padding: 0; }
.island-landscape .island-title {
  float: none;
  margin: 0 auto 40px; }
.island-landscape .island-content {
  float: none; } }
.island-footer {
  bottom: -2em;
  position: absolute;
  right: 0; }

form {
  margin-bottom: 8px; }

input {
  display: block;
  margin-bottom: 20px; }

.form-control {
  font-size: 16px;
  height: 36px;
  line-height: 1; }

::-webkit-input-placeholder {
  font-weight: 400; }

:-moz-placeholder {
  /* Firefox 18- */
  font-weight: 400; }

::-moz-placeholder {
  /* Firefox 19+ */
  font-weight: 400; }

:-ms-input-placeholder {
  font-weight: 400; }

.fa-envelope-o {
  font-size: 36px;
  color: #d4d9da;
  margin-bottom: 18px; }

.fa-chevron-down {
  font-size: 10px;
  margin-top: 4px;
  position: absolute;
  right: 8px;
  top: 5px; }

.instructions-sent {
  color: #43575c;
  font-weight: 300; }

.email-display {
  color: #43575c;
  font-size: 16px;
  margin-bottom: 16px; }

.left {
  display: inline-block;
  text-align: left;
  width: 50%; }

.right {
  display: inline-block;
  text-align: right;
  width: 50%; }

.link-lowlight {
  color: #7f7f7f;
  font-size: 13px;
  font-weight: 300; }

.error-message {
  background-color: #febfc1;
  color: #ab2a2a;
  width: 100%;
  font-size: 11px;
  padding: 12px;
  line-height: 12px;
  margin-bottom: 20px; }

.saml-login {
  border-bottom: 1px solid #cccccc;
  color: #cccccc;
  font-size: 11px;
  line-height: 18px;
  margin-bottom: 10px;
  padding: 10px 0; }
  .saml-login .saml-login-link {
    font-weight: 700; }
  .saml-login p {
    color: #7f7f7f; }

.nav {
  position: relative;
  font-size: 12px;
  float: right;
  margin: 12px 18px 0 0;
  min-width: 120px;
  color: #9faaad; }

.dropdown-trigger {
  background: transparent;
  border: none;
  color: inherit;
  cursor: pointer;
  display: block;
  padding: 4px 24px 4px 8px;
  position: relative;
  text-align: left;
  width: 100%; }

.dropdown-content {
  position: absolute;
  top: 110%;
  list-style: none outside none;
  padding: 0;
  display: none; }
  .dropdown-content a {
    color: #7f7f7f;
    display: block;
    min-width: 120px;
    min-height: 18px;
    padding: 4px 8px; }

.dropdown-trigger.open, .dropdown-content.open {
  background-color: white;
  display: block;
  color: #7f7f7f; }

.dropdown-trigger:hover, .dropdown-content a:hover {
  background-color: #e0e4e5;
  color: #43575c; }

.panel {
  background-color: white;
  width: 460px;
  padding: 40px;
  margin: 0 auto 0;
  text-align: center; }
  .panel .panel-content {
    color: #7f7f7f;
    text-align: left;
    margin-top: 16px; }
    .panel .panel-content h2 {
      color: #43575c; }
    .panel .panel-content p {
      margin-top: 10px; }
    .panel .panel-content ul {
      padding: 0px;
      list-style: none outside none; }

.application-link {
  font-size: 14px; }

.application-scopes {
  border: 1px solid #cccccc;
  margin: 12px 0;
  padding: 20px; }
  .application-scopes li {
    padding: 0 16px 16px 16px; }
    .application-scopes li:first-child {
      padding-top: 16px; }
  .application-scopes input {
    display: inline-block;
    margin: 6px 0;
    vertical-align: top; }
  .application-scopes label {
    width: 298px;
    margin-left: 10px; }
  .application-scopes .undecided label {
    font-weight: 600; }

.actions {
  margin-top: 40px;
  text-align: center; }
  .actions button[type='submit'] {
    height: 30px;
    line-height: 12px;
    margin: 0 10px;
    min-width: 120px; }

.profile span {
  display: inline-block;
  width: 60%; }
.profile a {
  display: inline-block;
  width: 40%;
  text-align: right; }

.client-scopes .application-scopes label {
  width: 276px; }

.application-label h3 {
  display: inline-block;
  width: 70%; }
.application-label a {
  display: inline-block;
  width: 30%; }

.revocation-scrim {
  background-color: rgba(66, 66, 66, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  display: none; }
  .revocation-scrim .revocation-modal {
    background-color: white;
    z-index: 1000;
    width: 400px;
    margin: 200px auto 0 auto;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }
    .revocation-scrim .revocation-modal p {
      padding: 4px 18px 4px 18px; }
    .revocation-scrim .revocation-modal .revocation-modal-header {
      padding: 18px;
      border-bottom: 1px solid #d4d9da; }
      .revocation-scrim .revocation-modal .revocation-modal-header h3 {
        display: inline-block;
        width: 80%;
        height: auto;
        font-size: 14px;
        font-weight: 600;
        line-height: 14px;
        color: #424242;
        text-transform: uppercase; }
      .revocation-scrim .revocation-modal .revocation-modal-header .close-icon {
        display: inline-block;
        width: 20%;
        text-align: right;
        cursor: pointer; }
    .revocation-scrim .revocation-modal .revocation-actions {
      padding: 8px 18px 18px 0;
      text-align: right; }
      .revocation-scrim .revocation-modal .revocation-actions button {
        height: 28px;
        line-height: 12px;
        margin: 0 4px;
        min-width: 100px; }

.passcode input {
  text-align: center;
  font-size: 18px; }

.island-button, .forgot-password-button {
  text-transform: uppercase;
  font-size: 14px;
  height: 34px;
  padding: 0;
  line-height: 14px; }
  .island-button[disabled], [disabled].forgot-password-button {
    background-color: white;
    border-width: 1px 2px 2px 1px;
    border-color: rgba(0, 0, 0, 0.16);
    color: #7f7f7f;
    opacity: 1; }

.forgot-password-button {
  letter-spacing: 0; }

.tiles {
  list-style: none outside none;
  margin-top: 40px;
  padding: 0; }
.tiles li {
  display: inline-block;
  margin: 10px; }
.tiles a {
  background-color: white;
  background-repeat: no-repeat;
  background-position: 50% 54%;
  background-size: 88%;
  border: 1px solid #cccccc;
  display: block;
  height: 86px;
  overflow: hidden;
  width: 158px;
  padding: 8px;
  margin: 4px;}
.tile-icon {
  width: 100%;
  height: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain; }

.alert {
  font-weight: 600;
  padding: 15px;
  margin-bottom: 50px;
  border: 1px solid transparent;
  border-radius: 0px;
  font-size: 13px;
  text-align: left; }

.alert-success {
  background-color: #afd79b;
  color: #165450; }

.alert-error {
  background-color: #febfc1;
  border-color: #febfc1;
  color: #ab2a2a; }

.alert p:before {
  font-family: FontAwesome;
  padding-right: 5px;
  font-size: 16px; }

.alert-success p:before {
  content: '\f058'; }

.alert-error p:before {
  content: '\f071'; }

h1 {
  color: #424242; }

.header {
  height: 125px; }

.panel-container {
  margin-top: 32px; }