/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
/*# sourceMappingURL=normalize.min.css.map */

body, input, select { color:#5f6368; font-family:"Roboto", sans-serif; font-weight:400; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { color:#202124; font-family:"NA Sans", serif; font-weight:400; }
kbd { color: #fff; background-color: #333; border-radius: 3px; box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); padding:2px 4px; }
a { color:#538AE4; text-decoration:none; }
hr { border:0; border-top:1px solid #eee; height:0; margin: 40px 0; }
label { color:rgba(0,0,0,0.9); }
pre { margin:0; overflow:auto; }
code { background-color: #f7f7f9; border-radius: .25rem; color: #bd4147; font-family: Menlo,Monaco,Consolas,Courier New,monospace; font-size: 90%; padding: .2rem .4rem; }
pre code { padding:0; }
button { background:none; border:none; outline:none; }

:target { background-color: #ffa; }
ul, li { padding:0; margin:0; }

.b--na-blue { border-color: #1a73e8; }
.b--na-coal-light {border-color:#47545f;}
.bg-na-blue { background:#1a73e8;}
.bg-na-coal { background:#3A454E; }
.bg-na-grey-1 { background:#fbfcfd;}
.bg-na-red { background:#d61818; }
.na-blue { color:#1a73e8; }
.na-green { color:#18D689;}
.na-red { color:#d61818;}
.lh-copy { line-height:2 !important;}
.lh-title { line-height:1.6 !important;}

.gs { font-family:'NA Sans'; }

.http-method { margin-right:.2em; }
.http-url { font-family:Menlo,Monaco,Consolas,Courier New,monospace; word-break:break-all; }

.json-wrapper { font-size:13px; line-height:1.5em; height:600px; overflow-y:auto; padding:10px; position:relative; }
.json-wrapper a { word-break:break-all; }
.jsonview .prop { color:#000; }

.label { border-radius: .25em; color: #fff; display: inline; font-weight: 400; font-size: 75%; line-height: 1; padding: .3em .6em; text-align: center; white-space: nowrap; vertical-align: baseline; }
.label-primary { background-color:#18D689; }

.sources-container:after { clear:both; content:" "; display:table; box-sizing:border-box; }
.sources-container .source a { max-height:80px; overflow:hidden; }
.sources-container .source a:after { clear:both; content:" "; display:table; box-sizing:border-box; }
.sources-container .source .name { color:#333; line-height:1.5em; width:100%;}
.sources-container .source .icon { border-radius: 3px; float:left; height:80px; margin-right:10px; opacity: 0; transition: opacity 2s; width:80px; }
.sources-container .source .icon.loaded { opacity:1; }

/* validation errors */
.validation-summary-errors {background-color:rgb(242, 222, 222);border-bottom-color:rgb(235, 204, 209);border-bottom-left-radius:2px;border-bottom-right-radius:2px;border-bottom-style:solid;border-bottom-width:1px;border-image-outset:0px;border-image-repeat:stretch;border-image-slice:100%;border-image-source:none;border-image-width:1;border-left-color:rgb(235, 204, 209);border-left-style:solid;border-left-width:1px;border-right-color:rgb(235, 204, 209);border-right-style:solid;border-right-width:1px;border-top-color:rgb(235, 204, 209);border-top-left-radius:2px;border-top-right-radius:2px;border-top-style:solid;border-top-width:1px;box-sizing:border-box;color:rgb(169, 68, 66);display:block;font-size:16px;line-height:27px;margin-bottom:20px;padding-bottom:15px;padding-left:15px;padding-right:15px;padding-top:15px; }
.validation-summary-errors ul { margin:0; padding-left:20px;}

/* alert container */
.alert { border:1px solid; border-radius:2px; font-size:15px; line-height: 1.5em; padding: 14px; position:relative; }
.alert p { margin-top:0; }
.alert p:last-of-type { margin-bottom:0; }
.alert .close { cursor: pointer; line-height:1; position:absolute; top:14px; right:14px; }
.alert-info { background: #d5e1f2; border-color:#9bb7e0; color: #2b579a; }
.alert-error { background: #F2DEDE; border-color:#dca7a7; color: #B94A48; }
.alert-warning { background: #FCF8E3; border-color:#f5e79e; color: #C09853; }
.alert-success { background: #DFF0D8; border-color:#b2dba1; color: #468847; }

/* callouts */
.callout { padding: 12px 20px; margin: 20px 0; border: 1px solid #eee; border-left-width: 3px; border-radius: 3px;}
.callout-info { border-left-color:#538AE4; }

/*Spinner*/
.spinner { align-items:center; bottom:0; display:flex; justify-content:center; left:0; position:absolute; right:0; top:0; }
.spinner-inner { -webkit-animation: rotator 1.4s linear infinite; animation: rotator 1.4s linear infinite; }
.spinner-path { stroke-dasharray: 187; stroke-dashoffset: 0; -webkit-transform-origin: center; transform-origin: center; -webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite; animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;}

@-webkit-keyframes rotator { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(270deg); transform: rotate(270deg); }}
@keyframes rotator { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(270deg); transform: rotate(270deg); }}
@-webkit-keyframes colors { 0% { stroke: #4285F4; } 25% { stroke: #DE3E35; } 50% { stroke: #F7C223; } 75% { stroke: #1B9A59; } 100% { stroke: #4285F4; }}
@keyframes colors { 0% { stroke: #4285F4; } 25% { stroke: #DE3E35; } 50% { stroke: #F7C223; } 75% { stroke: #1B9A59; } 100% { stroke: #4285F4; }}
@-webkit-keyframes dash { 0% { stroke-dashoffset: 187; } 50% { stroke-dashoffset: 46.75; -webkit-transform: rotate(135deg); transform: rotate(135deg); } 100% { stroke-dashoffset: 187; -webkit-transform: rotate(450deg); transform: rotate(450deg); }}
@keyframes dash { 0% { stroke-dashoffset: 187; } 50% { stroke-dashoffset: 46.75; -webkit-transform: rotate(135deg); transform: rotate(135deg); } 100% { stroke-dashoffset: 187; -webkit-transform: rotate(450deg); transform: rotate(450deg); }}
/*Spinner*/

/* code carousel */
.code-carousel { overflow:hidden;}
.code-carousel-inner { padding:10px 0; transform: translate3d(0,0,0); white-space:nowrap; }
.code-carousel-inner > * { display:inline-block; margin-right:100px; white-space:normal; vertical-align:top; }

/* Forms */
label { display: inline-block; line-height:1.5; max-width: 100%; margin-bottom: 5px; font-weight: 700; }
input[type=checkbox], input[type=radio] { margin: 4px 0 0; margin-top: 1px; line-height: normal; }
input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; }

.form-group { margin-bottom:15px; }
.form-control { display: block; line-height: 1.5; color: #555; width: 100%; padding: 6px 12px; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; box-shadow: inset 0 1px 1px rgba(0,0,0,.075); transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }

.radio-group { border:1px solid #ccc; border-radius:4px; box-shadow: inset 0 1px 1px rgba(0,0,0,.075); margin-bottom:15px; }
.radio-group .radio { border-bottom:1px solid #ccc; }
.radio-group .radio:last-child { border-bottom:none; }

.radio { padding:6px 12px; }

.checkbox { position: relative; display: block; margin-top: 10px; margin-bottom: 10px; }
.checkbox label, .radio label { min-height: 20px; padding-left: 20px; margin-bottom: 0; font-weight: 400; cursor: pointer;}
.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] { position: absolute; margin-top: 4px; margin-left: -20px; }

.btn { align-items:center; box-shadow:0 1px 1px rgba(0,0,0,0.2); display:inline-flex; padding: 6px 12px; font-weight: 400; line-height: 1.5; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; user-select: none; border-radius: 2px; border: none; text-decoration:none; transition: .3s ease; }
.btn[disabled] { cursor:not-allowed; opacity:0.5; }
.btn-default { background-color: #f5f5f5; color: #777; }
.btn-bare { background:#ffffff; border:none; padding:6px 12px; }

 /* ladda */
 .ladda-button[data-style=slide-left] .ladda-label { align-items:center; display:flex; }

/*------------------------------------
- Tables
------------------------------------*/
.table-bordered, .table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border: 1px solid #ddd;
}
.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}
table {
    background-color: transparent;
}
table {
    border-spacing: 0;
    border-collapse: collapse;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #fbfcfd;
}
.table-bordered, .table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border: 1px solid #ddd;
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}
caption, th {
    text-align: left;
}
td, th {
    padding: 0;
}

/* Tables end */

/* Alt tables */
.table-group { margin: 8px 0 0 0; border-top: 1px solid #e1e8ed; padding:0;}
.table-group-item { padding: 17px 0; border-bottom: 1px solid #f0f4f7; list-style:none; zoom:1; }
.table-group-item-label { position: relative; float: left; text-align: right; width: 120px; font-size: 14px; margin:0; font-weight: 500;}
.table-group-item-label-details { display:block; color: #939da3; font-size: 13px; font-weight: 400; text-transform: none; word-break: normal;}
.table-group-item-label-details.important { color:#ffae54; text-transform:uppercase; }
.table-group-item-description { margin: 0 0 0 140px; min-height:64px; font-size: 14px; position: relative; background: #fff;}
.table-group-item-description code { font-size: 13px; box-sizing: border-box; display: inline-block; padding: 0 5px; background: #fafcfc; border: 1px solid #f0f4f7; border-radius: 4px; color: #b93d6a; font-family: Source Code Pro,Menlo,monospace; line-height: 22px;}
.table-group-item-clearfix:before { content: ""; display: table; }
.table-group-item-clearfix:after { content: ""; clear:both; display: table; }
.table-group-child { margin-top: 22px; position: relative; margin-top: 16px; padding: 0; border: 1px solid #e9edf0; border-radius: 6px; }
.table-group-child:before { left: 170px; position: absolute; top: -9px; display: block; height: 9px; width: 14px; background-color: #fff; background-repeat: no-repeat; content: ''; background-image: url(/images/docs-child-pointer.png);}
.table-group-child .table-group { border-top:none; margin:0; }
.table-group-title { padding: 10px 20px; color: #0099e5; cursor: pointer; font-weight: 500; margin:0; user-select: none; text-transform: none;}

/* Alt tables end */

/* Tab box */
[ripple] {
  z-index: 1;
  position: relative;
  overflow: hidden;
}
[ripple] .ripple {
  position: absolute;
  background: #FFFFFF;
  width: 12px;
  height: 12px;
  border-radius: 100%;
  -webkit-animation: ripple 1.6s;
          animation: ripple 1.6s;
}

@-webkit-keyframes ripple {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: scale(40);
            transform: scale(40);
    opacity: 0;
  }
}

@keyframes ripple {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0.2;
  }
  100% {
    -webkit-transform: scale(40);
            transform: scale(40);
    opacity: 0;
  }
}
.tabs {
  z-index: 15px;
  position: relative;
  background: #FFFFFF;
  border-radius: 4px;
  box-sizing: border-box;
  overflow: hidden;
}
.tabs-header {
  position: relative;
  background: #538ae4;
  line-height:1;
  overflow: hidden;
}
.tabs-header .border {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #F4B142;
  width: auto;
  height: 2px;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
.tabs-header ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: calc(100% - 68px);
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.tabs-header li {
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}
.tabs-header a {
  z-index: 1;
  display: block;
  box-sizing: border-box;
  padding: 15px 20px;
  color: #FFFFFF;
  font-weight: 500;
  text-decoration: none;
}
.tabs-nav {
  position: absolute;
  top: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  padding: 0 10px;
  color: #FFFFFF;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.tabs-nav:before {
  content: '';
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  box-shadow: 0 0 20px 10px #538ae4;
}
.tabs-nav i {
  border-radius: 100%;
  cursor: pointer;
  padding:8px;
}
.tabs-content {
  position: relative;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
  overflow: hidden;
}
.tabs-content .tab {
  display: none;
  padding:10px;
}
.tabs-content .tab.active {
  display: block;
}

/* Tab box end */

/* Tooltips */
/* START TOOLTIP STYLES */
[tooltip] {
  position: relative; /* opinion 1 */
}

/* Applies to all tooltips */
[tooltip]::before,
[tooltip]::after {
  text-transform: none; /* opinion 2 */
  font-size: .9em; /* opinion 3 */
  line-height: 1;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
  position: absolute;
  display: none;
  opacity: 0;
}
[tooltip]::before {
  content: '';
  border: 5px solid transparent; /* opinion 4 */
  z-index: 1001; /* absurdity 1 */
}
[tooltip]::after {
  content: attr(tooltip); /* magic! */
  
  /* most of the rest of this is opinion */
  font-family: Helvetica, sans-serif;
  text-align: center;
  
  /* 
    Let the content set the size of the tooltips 
    but this will also keep them from being obnoxious
    */
  min-width: 3em;
  max-width: 21em;
  padding: 1ch 1.5ch;
  border-radius: .3ch;
  box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
  background: #333;
  line-height:1.5em;
  color: #fff;
  z-index: 1000; /* absurdity 2 */
  width:250px;
}

/* Make the tooltips respond to hover */
[tooltip]:hover::before,
[tooltip]:hover::after {
  display: block;
}

/* don't show empty tooltips */
[tooltip='']::before,
[tooltip='']::after {
  display: none !important;
}

/* FLOW: UP */
[tooltip]:not([flow])::before,
[tooltip][flow^="up"]::before {
  bottom: 100%;
  border-bottom-width: 0;
  border-top-color: #333;
}
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::after {
  bottom: calc(100% + 5px);
}
[tooltip]:not([flow])::before,
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::before,
[tooltip][flow^="up"]::after {
  left: 50%;
  -webkit-transform: translate(-50%, -.5em);
          transform: translate(-50%, -.5em);
}

/* FLOW: DOWN */
[tooltip][flow^="down"]::before {
  top: 100%;
  border-top-width: 0;
  border-bottom-color: #333;
}
[tooltip][flow^="down"]::after {
  top: calc(100% + 5px);
}
[tooltip][flow^="down"]::before,
[tooltip][flow^="down"]::after {
  left: 50%;
  -webkit-transform: translate(-50%, .5em);
          transform: translate(-50%, .5em);
}

/* FLOW: LEFT */
[tooltip][flow^="left"]::before {
  top: 50%;
  border-right-width: 0;
  border-left-color: #333;
  left: calc(0em - 5px);
  -webkit-transform: translate(-.5em, -50%);
          transform: translate(-.5em, -50%);
}
[tooltip][flow^="left"]::after {
  top: 50%;
  right: calc(100% + 5px);
  -webkit-transform: translate(-.5em, -50%);
          transform: translate(-.5em, -50%);
}

/* FLOW: RIGHT */
[tooltip][flow^="right"]::before {
  top: 50%;
  border-left-width: 0;
  border-right-color: #333;
  right: calc(0em - 5px);
  -webkit-transform: translate(.5em, -50%);
          transform: translate(.5em, -50%);
}
[tooltip][flow^="right"]::after {
  top: 50%;
  left: calc(100% + 5px);
  -webkit-transform: translate(.5em, -50%);
          transform: translate(.5em, -50%);
}

/* KEYFRAMES */
@-webkit-keyframes tooltips-vert {
  to {
    opacity: .9;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
}
@keyframes tooltips-vert {
  to {
    opacity: .9;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
}

@-webkit-keyframes tooltips-horz {
  to {
    opacity: .9;
    -webkit-transform: translate(0, -50%);
            transform: translate(0, -50%);
  }
}

@keyframes tooltips-horz {
  to {
    opacity: .9;
    -webkit-transform: translate(0, -50%);
            transform: translate(0, -50%);
  }
}

/* FX All The Things */ 
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):hover::after,
[tooltip][flow^="up"]:hover::before,
[tooltip][flow^="up"]:hover::after,
[tooltip][flow^="down"]:hover::before,
[tooltip][flow^="down"]:hover::after {
  -webkit-animation: tooltips-vert 300ms ease-out forwards;
          animation: tooltips-vert 300ms ease-out forwards;
}

[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after,
[tooltip][flow^="right"]:hover::before,
[tooltip][flow^="right"]:hover::after {
  -webkit-animation: tooltips-horz 300ms ease-out forwards;
          animation: tooltips-horz 300ms ease-out forwards;
}

/* tooltips end */

/* toggle switch */

.btn-toggle {
  margin: 0 4rem;
  padding: 0;
  position: relative;
  border: none;
  height: 1.5rem;
  width: 3rem;
  border-radius: 1.5rem;
  color: #6b7381;
  background: #bdc1c8;
}
.btn-toggle:focus,
.btn-toggle.focus,
.btn-toggle:focus.active,
.btn-toggle.focus.active {
  outline: none;
}
.btn-toggle:before,
.btn-toggle:after {
  line-height: 1.5rem;
  width: 4rem;
  text-align: center;
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity .25s;
}
.btn-toggle:before {
  content: 'Off';
  left: -4rem;
}
.btn-toggle:after {
  content: 'On';
  right: -4rem;
  opacity: .5;
}
.btn-toggle > .handle {
  position: absolute;
  top: 0.1875rem;
  left: 0.1875rem;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 1.125rem;
  background: #fff;
  transition: left .25s;
}
.btn-toggle.active {
  transition: background-color 0.25s;
}
.btn-toggle.active > .handle {
  left: 1.6875rem;
  transition: left .25s;
}
.btn-toggle.active:before {
  opacity: .5;
}
.btn-toggle.active:after {
  opacity: 1;
}
.btn-toggle.btn-sm:before,
.btn-toggle.btn-sm:after {
  line-height: -0.5rem;
  color: #fff;
  letter-spacing: .75px;
  left: 0.4125rem;
  width: 2.325rem;
}
.btn-toggle.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-xs:before,
.btn-toggle.btn-xs:after {
  display: none;
}
.btn-toggle:before,
.btn-toggle:after {
  color: #6b7381;
}
.btn-toggle.active {
  background-color: #538AE4;
}
.btn-toggle.btn-lg {
  margin: 0 5rem;
  padding: 0;
  position: relative;
  border: none;
  height: 2.5rem;
  width: 5rem;
  border-radius: 2.5rem;
}
.btn-toggle.btn-lg:focus,
.btn-toggle.btn-lg.focus,
.btn-toggle.btn-lg:focus.active,
.btn-toggle.btn-lg.focus.active {
  outline: none;
}
.btn-toggle.btn-lg:before,
.btn-toggle.btn-lg:after {
  line-height: 2.5rem;
  width: 5rem;
  text-align: center;
  font-weight: 600;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity .25s;
}
.btn-toggle.btn-lg:before {
  content: 'Off';
  left: -5rem;
}
.btn-toggle.btn-lg:after {
  content: 'On';
  right: -5rem;
  opacity: .5;
  top:1px;
}
.btn-toggle.btn-lg > .handle {
  position: absolute;
  top: 0.3125rem;
  left: 0.3125rem;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 1.875rem;
  background: #fff;
  transition: left .25s;
}
.btn-toggle.btn-lg.active {
  transition: background-color 0.25s;
}
.btn-toggle.btn-lg.active > .handle {
  left: 2.8125rem;
  transition: left .25s;
}
.btn-toggle.btn-lg.active:before {
  opacity: .5;
}
.btn-toggle.btn-lg.active:after {
  opacity: 1;
}
.btn-toggle.btn-lg.btn-sm:before,
.btn-toggle.btn-lg.btn-sm:after {
  line-height: 0.5rem;
  color: #fff;
  letter-spacing: .75px;
  left: 0.6875rem;
  width: 3.875rem;
}
.btn-toggle.btn-lg.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-lg.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-lg.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-lg.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-lg.btn-xs:before,
.btn-toggle.btn-lg.btn-xs:after {
  display: none;
}
.btn-toggle.btn-sm {
  margin: 0;
  padding: 0;
  position: relative;
  border: none;
  height: 1.5rem;
  width: 3rem;
  border-radius: 1.5rem;
}
.btn-toggle.btn-sm:focus,
.btn-toggle.btn-sm.focus,
.btn-toggle.btn-sm:focus.active,
.btn-toggle.btn-sm.focus.active {
  outline: none;
}
.btn-toggle.btn-sm:before,
.btn-toggle.btn-sm:after {
  line-height: 1.5rem;
  width: 0.5rem;
  text-align: center;
  font-weight: 600;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity .25s;
}
.btn-toggle.btn-sm:before {
  content: 'Off';
  left: -0.5rem;
}
.btn-toggle.btn-sm:after {
  content: 'On';
  right: -0.5rem;
  opacity: .5;
}
.btn-toggle.btn-sm > .handle {
  position: absolute;
  top: 0.1875rem;
  left: 0.1875rem;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 1.125rem;
  background: #fff;
  transition: left .25s;
}
.btn-toggle.btn-sm.active {
  transition: background-color 0.25s;
}
.btn-toggle.btn-sm.active > .handle {
  left: 1.6875rem;
  transition: left .25s;
}
.btn-toggle.btn-sm.active:before {
  opacity: .5;
}
.btn-toggle.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-sm.btn-sm:before,
.btn-toggle.btn-sm.btn-sm:after {
  line-height: -0.5rem;
  color: #fff;
  letter-spacing: .75px;
  left: 0.4125rem;
  width: 2.325rem;
}
.btn-toggle.btn-sm.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-sm.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-sm.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-sm.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-sm.btn-xs:before,
.btn-toggle.btn-sm.btn-xs:after {
  display: none;
}
.btn-toggle.btn-xs {
  margin: 0 0;
  padding: 0;
  position: relative;
  border: none;
  height: 1rem;
  width: 2rem;
  border-radius: 1rem;
}
.btn-toggle.btn-xs:focus,
.btn-toggle.btn-xs.focus,
.btn-toggle.btn-xs:focus.active,
.btn-toggle.btn-xs.focus.active {
  outline: none;
}
.btn-toggle.btn-xs:before,
.btn-toggle.btn-xs:after {
  line-height: 1rem;
  width: 0;
  text-align: center;
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity .25s;
}
.btn-toggle.btn-xs:before {
  content: 'Off';
  left: 0;
}
.btn-toggle.btn-xs:after {
  content: 'On';
  right: 0;
  opacity: .5;
}
.btn-toggle.btn-xs > .handle {
  position: absolute;
  top: 0.125rem;
  left: 0.125rem;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 0.75rem;
  background: #fff;
  transition: left .25s;
}
.btn-toggle.btn-xs.active {
  transition: background-color 0.25s;
}
.btn-toggle.btn-xs.active > .handle {
  left: 1.125rem;
  transition: left .25s;
}
.btn-toggle.btn-xs.active:before {
  opacity: .5;
}
.btn-toggle.btn-xs.active:after {
  opacity: 1;
}
.btn-toggle.btn-xs.btn-sm:before,
.btn-toggle.btn-xs.btn-sm:after {
  line-height: -1rem;
  color: #fff;
  letter-spacing: .75px;
  left: 0.275rem;
  width: 1.55rem;
}
.btn-toggle.btn-xs.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-xs.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-xs.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-xs.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-xs.btn-xs:before,
.btn-toggle.btn-xs.btn-xs:after {
  display: none;
}
.btn-toggle.btn-secondary {
  color: #6b7381;
  background: #bdc1c8;
}
.btn-toggle.btn-secondary:before,
.btn-toggle.btn-secondary:after {
  color: #6b7381;
}
.btn-toggle.btn-secondary.active {
  background-color: #ff8300;
}