.example{margin:4rem auto}.example>.row{margin-top:2rem;height:5rem;vertical-align:middle;text-align:center;border:1px solid rgba(255,255,255,0.5)}.example>.row:first-of-type{border:none;height:auto;text-align:left}.example h3{font-weight:400}.example h3>small{font-weight:200;font-size:.75em;color:rgba(255,255,255,0.65)}.example h6{font-weight:700;font-size:.65rem;letter-spacing:3.32px;text-transform:uppercase;color:rgba(255,255,255,0.65);margin:0;line-height:5rem}.example .btn-toggle{top:50%;transform:translateY(-50%)}.btn-toggle{margin:0 4rem;padding:0;position:relative;border:none;height:1.5rem;width:3rem;border-radius:1.5rem;color:rgba(255,255,255,0.65);background:rgba(255,255,255,0.65)}.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:'Chat';left:-4rem}.btn-toggle:after{content:'Project';right:-5rem;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:rgba(255,255,255,0.65)}.btn-toggle.active{background-color:#d9ff42}.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:'Chat';left:-5rem}.btn-toggle.btn-lg:after{content:'Project';right:-6rem;opacity:.5}.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 0.5rem;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:'Chat';left:-0.5rem}.btn-toggle.btn-sm:after{content:'Project';right:-1.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:'Chat';left:0}.btn-toggle.btn-xs:after{content:'Project';right:-1;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}@media (min-width: 400px){.btn,button{width:auto}}.btn-arrow{position:relative;transition:background-color 300ms ease-out}.btn-arrow span{display:inline-block;position:relative;transition:all 300ms ease-out;will-change:transform}.btn-arrow:hover span{-webkit-transform:translate3d(-1rem, 0, 0);transform:translate3d(-1rem, 0, 0)}.btn-arrow svg{position:absolute;width:1.1em;right:0px;right:0rem;opacity:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);transition:all 300ms ease-out;will-change:right, opacity}.btn-arrow svg *{stroke-width:5;stroke-color:transparent}.btn-arrow:hover svg{opacity:1;right:-1.8rem}.custom-control-input:checked ~ .custom-control-label::before{color:#fff;border-color:#d9ff42;background-color:#d9ff42}