html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%
}
body {
  margin: 0
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline
}
audio:not([controls]) {
  display: none;
  height: 0
}
[hidden],
template {
  display: none
}
a {
  background-color: transparent
}
a:active,
a:hover {
  outline: 0
}
abbr[title] {
  border-bottom: 1px dotted
}
b,
strong {
  font-weight: 700
}
dfn {
  font-style: italic
}
mark {
  background: #ff0;
  color: #000
}
small {
  font-size: 80%
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}
sup {
  top: -.5em
}
sub {
  bottom: -.25em
}
img {
  border: 0
}
svg:not(:root) {
  overflow: hidden
}
figure {
  margin: 1em 40px
}
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0
}
pre {
  overflow: auto
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0
}
button {
  overflow: visible
}
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
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0
}
input {
  line-height: normal
}
input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  padding: 0
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  height: auto
}
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
}
fieldset {
  border: 1px solid silver;
  margin: 0 2px;
  padding: .35em .625em .75em
}
legend {
  border: 0;
  padding: 0
}
textarea {
  overflow: auto
}
optgroup {
  font-weight: 700
}
table {
  border-collapse: collapse;
  border-spacing: 0
}
td,
th {
  padding: 0
}
.hidden,
[hidden] {
  display: none !important
}
.pure-img {
  max-width: 100%;
  height: auto;
  display: block
}
.pure-g {
  text-rendering: optimizespeed;
  display: -webkit-flex;
  -webkit-flex-flow: row wrap;
  display: -ms-flexbox;
  -ms-flex-flow: row wrap;
  -ms-align-content: flex-start;
  -webkit-align-content: flex-start;
  align-content: flex-start
}
.opera-only :-o-prefocus,
.pure-g {
  word-spacing: -.43em
}
.pure-u {
  display: inline-block;
  *display: inline;
  zoom: 1;
  vertical-align: top;
  text-rendering: auto
}
.pure-u-1,
.pure-u-1-1,
.pure-u-1-2,
.pure-u-1-3,
.pure-u-2-3,
.pure-u-1-4,
.pure-u-3-4,
.pure-u-1-5,
.pure-u-2-5,
.pure-u-3-5,
.pure-u-4-5,
.pure-u-5-5,
.pure-u-1-6,
.pure-u-5-6,
.pure-u-1-8,
.pure-u-3-8,
.pure-u-5-8,
.pure-u-7-8,
.pure-u-1-12,
.pure-u-5-12,
.pure-u-7-12,
.pure-u-11-12,
.pure-u-1-24,
.pure-u-2-24,
.pure-u-3-24,
.pure-u-4-24,
.pure-u-5-24,
.pure-u-6-24,
.pure-u-7-24,
.pure-u-8-24,
.pure-u-9-24,
.pure-u-10-24,
.pure-u-11-24,
.pure-u-12-24,
.pure-u-13-24,
.pure-u-14-24,
.pure-u-15-24,
.pure-u-16-24,
.pure-u-17-24,
.pure-u-18-24,
.pure-u-19-24,
.pure-u-20-24,
.pure-u-21-24,
.pure-u-22-24,
.pure-u-23-24,
.pure-u-24-24 {
  display: inline-block;
  *display: inline;
  zoom: 1;
  vertical-align: top;
  text-rendering: auto
}
.pure-u-1-24 {
  width: 4.1667%;
  *width: 4.1357%
}
.pure-u-1-12,
.pure-u-2-24 {
  width: 8.3333%;
  *width: 8.3023%
}
.pure-u-1-8,
.pure-u-3-24 {
  width: 12.5%;
  *width: 12.469%
}
.pure-u-1-6,
.pure-u-4-24 {
  width: 16.6667%;
  *width: 16.6357%
}
.pure-u-1-5 {
  width: 20%;
  *width: 19.969%
}
.pure-u-5-24 {
  width: 20.8333%;
  *width: 20.8023%
}
.pure-u-1-4,
.pure-u-6-24 {
  width: 25%;
  *width: 24.969%
}
.pure-u-7-24 {
  width: 29.1667%;
  *width: 29.1357%
}
.pure-u-1-3,
.pure-u-8-24 {
  width: 33.3333%;
  *width: 33.3023%
}
.pure-u-3-8,
.pure-u-9-24 {
  width: 37.5%;
  *width: 37.469%
}
.pure-u-2-5 {
  width: 40%;
  *width: 39.969%
}
.pure-u-5-12,
.pure-u-10-24 {
  width: 41.6667%;
  *width: 41.6357%
}
.pure-u-11-24 {
  width: 45.8333%;
  *width: 45.8023%
}
.pure-u-1-2,
.pure-u-12-24 {
  width: 50%;
  *width: 49.969%
}
.pure-u-13-24 {
  width: 54.1667%;
  *width: 54.1357%
}
.pure-u-7-12,
.pure-u-14-24 {
  width: 58.3333%;
  *width: 58.3023%
}
.pure-u-3-5 {
  width: 60%;
  *width: 59.969%
}
.pure-u-5-8,
.pure-u-15-24 {
  width: 62.5%;
  *width: 62.469%
}
.pure-u-2-3,
.pure-u-16-24 {
  width: 66.6667%;
  *width: 66.6357%
}
.pure-u-17-24 {
  width: 70.8333%;
  *width: 70.8023%
}
.pure-u-3-4,
.pure-u-18-24 {
  width: 75%;
  *width: 74.969%
}
.pure-u-19-24 {
  width: 79.1667%;
  *width: 79.1357%
}
.pure-u-4-5 {
  width: 80%;
  *width: 79.969%
}
.pure-u-5-6,
.pure-u-20-24 {
  width: 83.3333%;
  *width: 83.3023%
}
.pure-u-7-8,
.pure-u-21-24 {
  width: 87.5%;
  *width: 87.469%
}
.pure-u-11-12,
.pure-u-22-24 {
  width: 91.6667%;
  *width: 91.6357%
}
.pure-u-23-24 {
  width: 95.8333%;
  *width: 95.8023%
}
.pure-u-1,
.pure-u-1-1,
.pure-u-5-5,
.pure-u-24-24 {
  width: 100%
}
.pure-button {
  display: inline-block;
  zoom: 1;
  line-height: normal;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
.pure-button::-moz-focus-inner {
  padding: 0;
  border: 0
}
.pure-button {
  font-family: inherit;
  font-size: 100%;
  padding: .5em 1em;
  color: #444;
  color: rgba(0, 0, 0, 0.8);
  border: 1px solid #999;
  border: 0 transparent;
  background-color: #e6e6e6;
  text-decoration: none;
  border-radius: 2px
}
.pure-button-hover,
.pure-button:hover,
.pure-button:focus {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000', GradientType=0);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0, 0, 0, 0.05)), to(rgba(0, 0, 0, 0.1)));
  background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.1));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.05) 0, rgba(0, 0, 0, 0.1));
  background-image: -o-linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.1));
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.1))
}
.pure-button:focus {
  outline: 0
}
.pure-button-active,
.pure-button:active {
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset, 0 0 6px rgba(0, 0, 0, 0.2) inset;
  border-color: #000 \9
}
.pure-button[disabled],
.pure-button-disabled,
.pure-button-disabled:hover,
.pure-button-disabled:focus,
.pure-button-disabled:active {
  border: 0;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  filter: alpha(opacity=40);
  -khtml-opacity: .4;
  -moz-opacity: .4;
  opacity: .4;
  cursor: not-allowed;
  box-shadow: none
}
.pure-button-hidden {
  display: none
}
.pure-button::-moz-focus-inner {
  padding: 0;
  border: 0
}
.pure-button-primary,
.pure-button-selected,
a.pure-button-primary,
a.pure-button-selected {
  background-color: #0078e7;
  color: #fff
}
.pure-form input[type=text],
.pure-form input[type=password],
.pure-form input[type=email],
.pure-form input[type=url],
.pure-form input[type=date],
.pure-form input[type=month],
.pure-form input[type=time],
.pure-form input[type=datetime],
.pure-form input[type=datetime-local],
.pure-form input[type=week],
.pure-form input[type=number],
.pure-form input[type=search],
.pure-form input[type=tel],
.pure-form input[type=color],
.pure-form select,
.pure-form textarea {
  padding: .5em .6em;
  display: inline-block;
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 3px #ddd;
  border-radius: 4px;
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
.pure-form input:not([type]) {
  padding: .5em .6em;
  display: inline-block;
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 3px #ddd;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
.pure-form input[type=color] {
  padding: .2em .5em
}
.pure-form input[type=text]:focus,
.pure-form input[type=password]:focus,
.pure-form input[type=email]:focus,
.pure-form input[type=url]:focus,
.pure-form input[type=date]:focus,
.pure-form input[type=month]:focus,
.pure-form input[type=time]:focus,
.pure-form input[type=datetime]:focus,
.pure-form input[type=datetime-local]:focus,
.pure-form input[type=week]:focus,
.pure-form input[type=number]:focus,
.pure-form input[type=search]:focus,
.pure-form input[type=tel]:focus,
.pure-form input[type=color]:focus,
.pure-form select:focus,
.pure-form textarea:focus {
  outline: 0;
  border-color: #129fea
}
.pure-form input:not([type]):focus {
  outline: 0;
  border-color: #129fea
}
.pure-form input[type=file]:focus,
.pure-form input[type=radio]:focus,
.pure-form input[type=checkbox]:focus {
  outline: thin solid #129fea;
  outline: 1px auto #129fea
}
.pure-form .pure-checkbox,
.pure-form .pure-radio {
  margin: .5em 0;
  display: block
}
.pure-form input[type=text][disabled],
.pure-form input[type=password][disabled],
.pure-form input[type=email][disabled],
.pure-form input[type=url][disabled],
.pure-form input[type=date][disabled],
.pure-form input[type=month][disabled],
.pure-form input[type=time][disabled],
.pure-form input[type=datetime][disabled],
.pure-form input[type=datetime-local][disabled],
.pure-form input[type=week][disabled],
.pure-form input[type=number][disabled],
.pure-form input[type=search][disabled],
.pure-form input[type=tel][disabled],
.pure-form input[type=color][disabled],
.pure-form select[disabled],
.pure-form textarea[disabled] {
  cursor: not-allowed;
  background-color: #eaeded;
  color: #cad2d3
}
.pure-form input:not([type])[disabled] {
  cursor: not-allowed;
  background-color: #eaeded;
  color: #cad2d3
}
.pure-form input[readonly],
.pure-form select[readonly],
.pure-form textarea[readonly] {
  background-color: #eee;
  color: #777;
  border-color: #ccc
}
.pure-form input:focus:invalid,
.pure-form textarea:focus:invalid,
.pure-form select:focus:invalid {
  color: #b94a48;
  border-color: #e9322d
}
.pure-form input[type=file]:focus:invalid:focus,
.pure-form input[type=radio]:focus:invalid:focus,
.pure-form input[type=checkbox]:focus:invalid:focus {
  outline-color: #e9322d
}
.pure-form select {
  height: 2.25em;
  border: 1px solid #ccc;
  background-color: #fff
}
.pure-form select[multiple] {
  height: auto
}
.pure-form label {
  margin: .5em 0 .2em
}
.pure-form fieldset {
  margin: 0;
  padding: .35em 0 .75em;
  border: 0
}
.pure-form legend {
  display: block;
  width: 100%;
  padding: .3em 0;
  margin-bottom: .3em;
  color: #333;
  border-bottom: 1px solid #e5e5e5
}
.pure-form-stacked input[type=text],
.pure-form-stacked input[type=password],
.pure-form-stacked input[type=email],
.pure-form-stacked input[type=url],
.pure-form-stacked input[type=date],
.pure-form-stacked input[type=month],
.pure-form-stacked input[type=time],
.pure-form-stacked input[type=datetime],
.pure-form-stacked input[type=datetime-local],
.pure-form-stacked input[type=week],
.pure-form-stacked input[type=number],
.pure-form-stacked input[type=search],
.pure-form-stacked input[type=tel],
.pure-form-stacked input[type=color],
.pure-form-stacked input[type=file],
.pure-form-stacked select,
.pure-form-stacked label,
.pure-form-stacked textarea {
  display: block;
  margin: .25em 0
}
.pure-form-stacked input:not([type]) {
  display: block;
  margin: .25em 0
}
.pure-form-aligned input,
.pure-form-aligned textarea,
.pure-form-aligned select,
.pure-form-aligned .pure-help-inline,
.pure-form-message-inline {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  vertical-align: middle
}
.pure-form-aligned textarea {
  vertical-align: top
}
.pure-form-aligned .pure-control-group {
  margin-bottom: .5em
}
.pure-form-aligned .pure-control-group label {
  text-align: right;
  display: inline-block;
  vertical-align: middle;
  width: 10em;
  margin: 0 1em 0 0
}
.pure-form-aligned .pure-controls {
  margin: 1.5em 0 0 11em
}
.pure-form input.pure-input-rounded,
.pure-form .pure-input-rounded {
  border-radius: 2em;
  padding: .5em 1em
}
.pure-form .pure-group fieldset {
  margin-bottom: 10px
}
.pure-form .pure-group input,
.pure-form .pure-group textarea {
  display: block;
  padding: 10px;
  margin: 0 0 -1px;
  border-radius: 0;
  position: relative;
  top: -1px
}
.pure-form .pure-group input:focus,
.pure-form .pure-group textarea:focus {
  z-index: 3
}
.pure-form .pure-group input:first-child,
.pure-form .pure-group textarea:first-child {
  top: 1px;
  border-radius: 4px 4px 0 0;
  margin: 0
}
.pure-form .pure-group input:first-child:last-child,
.pure-form .pure-group textarea:first-child:last-child {
  top: 1px;
  border-radius: 4px;
  margin: 0
}
.pure-form .pure-group input:last-child,
.pure-form .pure-group textarea:last-child {
  top: -2px;
  border-radius: 0 0 4px 4px;
  margin: 0
}
.pure-form .pure-group button {
  margin: .35em 0
}
.pure-form .pure-input-1 {
  width: 100%
}
.pure-form .pure-input-2-3 {
  width: 66%
}
.pure-form .pure-input-1-2 {
  width: 50%
}
.pure-form .pure-input-1-3 {
  width: 33%
}
.pure-form .pure-input-1-4 {
  width: 25%
}
.pure-form .pure-help-inline,
.pure-form-message-inline {
  display: inline-block;
  padding-left: .3em;
  color: #666;
  vertical-align: middle;
  font-size: .875em
}
.pure-form-message {
  display: block;
  color: #666;
  font-size: .875em
}
@media only screen and (max-width: 480px) {
  .pure-form button[type=submit] {
    margin: .7em 0 0
  }
  .pure-form input:not([type]),
  .pure-form input[type=text],
  .pure-form input[type=password],
  .pure-form input[type=email],
  .pure-form input[type=url],
  .pure-form input[type=date],
  .pure-form input[type=month],
  .pure-form input[type=time],
  .pure-form input[type=datetime],
  .pure-form input[type=datetime-local],
  .pure-form input[type=week],
  .pure-form input[type=number],
  .pure-form input[type=search],
  .pure-form input[type=tel],
  .pure-form input[type=color],
  .pure-form label {
    margin-bottom: .3em;
    display: block
  }
  .pure-group input:not([type]),
  .pure-group input[type=text],
  .pure-group input[type=password],
  .pure-group input[type=email],
  .pure-group input[type=url],
  .pure-group input[type=date],
  .pure-group input[type=month],
  .pure-group input[type=time],
  .pure-group input[type=datetime],
  .pure-group input[type=datetime-local],
  .pure-group input[type=week],
  .pure-group input[type=number],
  .pure-group input[type=search],
  .pure-group input[type=tel],
  .pure-group input[type=color] {
    margin-bottom: 0
  }
  .pure-form-aligned .pure-control-group label {
    margin-bottom: .3em;
    text-align: left;
    display: block;
    width: 100%
  }
  .pure-form-aligned .pure-controls {
    margin: 1.5em 0 0
  }
  .pure-form .pure-help-inline,
  .pure-form-message-inline,
  .pure-form-message {
    display: block;
    font-size: .75em;
    padding: .2em 0 .8em
  }
}
.pure-menu {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
.pure-menu-fixed {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 3
}
.pure-menu-list,
.pure-menu-item {
  position: relative
}
.pure-menu-list {
  list-style: none;
  margin: 0;
  padding: 0
}
.pure-menu-item {
  padding: 0;
  margin: 0;
  height: 100%
}
.pure-menu-link,
.pure-menu-heading {
  display: block;
  text-decoration: none;
  white-space: nowrap
}
.pure-menu-horizontal {
  width: 100%;
  white-space: nowrap
}
.pure-menu-horizontal .pure-menu-list {
  display: inline-block
}
.pure-menu-horizontal .pure-menu-item,
.pure-menu-horizontal .pure-menu-heading,
.pure-menu-horizontal .pure-menu-separator {
  display: inline-block;
  *display: inline;
  zoom: 1;
  vertical-align: middle
}
.pure-menu-item .pure-menu-item {
  display: block
}
.pure-menu-children {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
  margin: 0;
  padding: 0;
  z-index: 3
}
.pure-menu-horizontal .pure-menu-children {
  left: 0;
  top: auto;
  width: inherit
}
.pure-menu-allow-hover:hover > .pure-menu-children,
.pure-menu-active > .pure-menu-children {
  display: block;
  position: absolute
}
.pure-menu-has-children > .pure-menu-link:after {
  padding-left: .5em;
  content: "\25B8";
  font-size: small
}
.pure-menu-horizontal .pure-menu-has-children > .pure-menu-link:after {
  content: "\25BE"
}
.pure-menu-scrollable {
  overflow-y: scroll;
  overflow-x: hidden
}
.pure-menu-scrollable .pure-menu-list {
  display: block
}
.pure-menu-horizontal.pure-menu-scrollable .pure-menu-list {
  display: inline-block
}
.pure-menu-horizontal.pure-menu-scrollable {
  white-space: nowrap;
  overflow-y: hidden;
  overflow-x: auto;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  padding: .5em 0
}
.pure-menu-horizontal.pure-menu-scrollable::-webkit-scrollbar {
  display: none
}
.pure-menu-separator {
  background-color: #ccc;
  height: 1px;
  margin: .3em 0
}
.pure-menu-horizontal .pure-menu-separator {
  width: 1px;
  height: 1.3em;
  margin: 0 .3em
}
.pure-menu-heading {
  text-transform: uppercase;
  color: #565d64
}
.pure-menu-link {
  color: #777
}
.pure-menu-children {
  background-color: #fff
}
.pure-menu-link,
.pure-menu-disabled,
.pure-menu-heading {
  padding: .5em 1em
}
.pure-menu-disabled {
  opacity: .5
}
.pure-menu-disabled .pure-menu-link:hover {
  background-color: transparent
}
.pure-menu-active > .pure-menu-link,
.pure-menu-link:hover,
.pure-menu-link:focus {
  background-color: transparent
}
.pure-menu-selected .pure-menu-link,
.pure-menu-selected .pure-menu-link:visited {
  color: #000
}
.pure-table {
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border: 1px solid #cbcbcb
}
.pure-table caption {
  color: #000;
  font: italic 85%/1 arial, sans-serif;
  padding: 1em 0;
  text-align: center
}
.pure-table td,
.pure-table th {
  border-left: 1px solid #cbcbcb;
  border-width: 0 0 0 1px;
  font-size: inherit;
  margin: 0;
  overflow: visible;
  padding: .5em 1em
}
.pure-table td:first-child,
.pure-table th:first-child {
  border-left-width: 0
}
.pure-table thead {
  background-color: #e0e0e0;
  color: #000;
  text-align: left;
  vertical-align: bottom
}
.pure-table td {
  background-color: transparent
}
.pure-table-odd td {
  background-color: #f2f2f2
}
.pure-table-striped tr:nth-child(2n-1) td {
  background-color: #f2f2f2
}
.pure-table-bordered td {
  border-bottom: 1px solid #cbcbcb
}
.pure-table-bordered tbody > tr:last-child > td {
  border-bottom-width: 0
}
.pure-table-horizontal td,
.pure-table-horizontal th {
  border-width: 0 0 1px;
  border-bottom: 1px solid #cbcbcb
}
.pure-table-horizontal tbody > tr:last-child > td {
  border-bottom-width: 0
}
@media screen and (min-width: 35.5em) {
  .pure-u-sm-1,
  .pure-u-sm-1-1,
  .pure-u-sm-1-2,
  .pure-u-sm-1-3,
  .pure-u-sm-2-3,
  .pure-u-sm-1-4,
  .pure-u-sm-3-4,
  .pure-u-sm-1-5,
  .pure-u-sm-2-5,
  .pure-u-sm-3-5,
  .pure-u-sm-4-5,
  .pure-u-sm-5-5,
  .pure-u-sm-1-6,
  .pure-u-sm-5-6,
  .pure-u-sm-1-8,
  .pure-u-sm-3-8,
  .pure-u-sm-5-8,
  .pure-u-sm-7-8,
  .pure-u-sm-1-12,
  .pure-u-sm-5-12,
  .pure-u-sm-7-12,
  .pure-u-sm-11-12,
  .pure-u-sm-1-24,
  .pure-u-sm-2-24,
  .pure-u-sm-3-24,
  .pure-u-sm-4-24,
  .pure-u-sm-5-24,
  .pure-u-sm-6-24,
  .pure-u-sm-7-24,
  .pure-u-sm-8-24,
  .pure-u-sm-9-24,
  .pure-u-sm-10-24,
  .pure-u-sm-11-24,
  .pure-u-sm-12-24,
  .pure-u-sm-13-24,
  .pure-u-sm-14-24,
  .pure-u-sm-15-24,
  .pure-u-sm-16-24,
  .pure-u-sm-17-24,
  .pure-u-sm-18-24,
  .pure-u-sm-19-24,
  .pure-u-sm-20-24,
  .pure-u-sm-21-24,
  .pure-u-sm-22-24,
  .pure-u-sm-23-24,
  .pure-u-sm-24-24 {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: top;
    text-rendering: auto
  }
  .pure-u-sm-1-24 {
    width: 4.1667%;
    *width: 4.1357%
  }
  .pure-u-sm-1-12,
  .pure-u-sm-2-24 {
    width: 8.3333%;
    *width: 8.3023%
  }
  .pure-u-sm-1-8,
  .pure-u-sm-3-24 {
    width: 12.5%;
    *width: 12.469%
  }
  .pure-u-sm-1-6,
  .pure-u-sm-4-24 {
    width: 16.6667%;
    *width: 16.6357%
  }
  .pure-u-sm-1-5 {
    width: 20%;
    *width: 19.969%
  }
  .pure-u-sm-5-24 {
    width: 20.8333%;
    *width: 20.8023%
  }
  .pure-u-sm-1-4,
  .pure-u-sm-6-24 {
    width: 25%;
    *width: 24.969%
  }
  .pure-u-sm-7-24 {
    width: 29.1667%;
    *width: 29.1357%
  }
  .pure-u-sm-1-3,
  .pure-u-sm-8-24 {
    width: 33.3333%;
    *width: 33.3023%
  }
  .pure-u-sm-3-8,
  .pure-u-sm-9-24 {
    width: 37.5%;
    *width: 37.469%
  }
  .pure-u-sm-2-5 {
    width: 40%;
    *width: 39.969%
  }
  .pure-u-sm-5-12,
  .pure-u-sm-10-24 {
    width: 41.6667%;
    *width: 41.6357%
  }
  .pure-u-sm-11-24 {
    width: 45.8333%;
    *width: 45.8023%
  }
  .pure-u-sm-1-2,
  .pure-u-sm-12-24 {
    width: 50%;
    *width: 49.969%
  }
  .pure-u-sm-13-24 {
    width: 54.1667%;
    *width: 54.1357%
  }
  .pure-u-sm-7-12,
  .pure-u-sm-14-24 {
    width: 58.3333%;
    *width: 58.3023%
  }
  .pure-u-sm-3-5 {
    width: 60%;
    *width: 59.969%
  }
  .pure-u-sm-5-8,
  .pure-u-sm-15-24 {
    width: 62.5%;
    *width: 62.469%
  }
  .pure-u-sm-2-3,
  .pure-u-sm-16-24 {
    width: 66.6667%;
    *width: 66.6357%
  }
  .pure-u-sm-17-24 {
    width: 70.8333%;
    *width: 70.8023%
  }
  .pure-u-sm-3-4,
  .pure-u-sm-18-24 {
    width: 75%;
    *width: 74.969%
  }
  .pure-u-sm-19-24 {
    width: 79.1667%;
    *width: 79.1357%
  }
  .pure-u-sm-4-5 {
    width: 80%;
    *width: 79.969%
  }
  .pure-u-sm-5-6,
  .pure-u-sm-20-24 {
    width: 83.3333%;
    *width: 83.3023%
  }
  .pure-u-sm-7-8,
  .pure-u-sm-21-24 {
    width: 87.5%;
    *width: 87.469%
  }
  .pure-u-sm-11-12,
  .pure-u-sm-22-24 {
    width: 91.6667%;
    *width: 91.6357%
  }
  .pure-u-sm-23-24 {
    width: 95.8333%;
    *width: 95.8023%
  }
  .pure-u-sm-1,
  .pure-u-sm-1-1,
  .pure-u-sm-5-5,
  .pure-u-sm-24-24 {
    width: 100%
  }
}
@media screen and (min-width: 48em) {
  .pure-u-md-1,
  .pure-u-md-1-1,
  .pure-u-md-1-2,
  .pure-u-md-1-3,
  .pure-u-md-2-3,
  .pure-u-md-1-4,
  .pure-u-md-3-4,
  .pure-u-md-1-5,
  .pure-u-md-2-5,
  .pure-u-md-3-5,
  .pure-u-md-4-5,
  .pure-u-md-5-5,
  .pure-u-md-1-6,
  .pure-u-md-5-6,
  .pure-u-md-1-8,
  .pure-u-md-3-8,
  .pure-u-md-5-8,
  .pure-u-md-7-8,
  .pure-u-md-1-12,
  .pure-u-md-5-12,
  .pure-u-md-7-12,
  .pure-u-md-11-12,
  .pure-u-md-1-24,
  .pure-u-md-2-24,
  .pure-u-md-3-24,
  .pure-u-md-4-24,
  .pure-u-md-5-24,
  .pure-u-md-6-24,
  .pure-u-md-7-24,
  .pure-u-md-8-24,
  .pure-u-md-9-24,
  .pure-u-md-10-24,
  .pure-u-md-11-24,
  .pure-u-md-12-24,
  .pure-u-md-13-24,
  .pure-u-md-14-24,
  .pure-u-md-15-24,
  .pure-u-md-16-24,
  .pure-u-md-17-24,
  .pure-u-md-18-24,
  .pure-u-md-19-24,
  .pure-u-md-20-24,
  .pure-u-md-21-24,
  .pure-u-md-22-24,
  .pure-u-md-23-24,
  .pure-u-md-24-24 {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: top;
    text-rendering: auto
  }
  .pure-u-md-1-24 {
    width: 4.1667%;
    *width: 4.1357%
  }
  .pure-u-md-1-12,
  .pure-u-md-2-24 {
    width: 8.3333%;
    *width: 8.3023%
  }
  .pure-u-md-1-8,
  .pure-u-md-3-24 {
    width: 12.5%;
    *width: 12.469%
  }
  .pure-u-md-1-6,
  .pure-u-md-4-24 {
    width: 16.6667%;
    *width: 16.6357%
  }
  .pure-u-md-1-5 {
    width: 20%;
    *width: 19.969%
  }
  .pure-u-md-5-24 {
    width: 20.8333%;
    *width: 20.8023%
  }
  .pure-u-md-1-4,
  .pure-u-md-6-24 {
    width: 25%;
    *width: 24.969%
  }
  .pure-u-md-7-24 {
    width: 29.1667%;
    *width: 29.1357%
  }
  .pure-u-md-1-3,
  .pure-u-md-8-24 {
    width: 33.3333%;
    *width: 33.3023%
  }
  .pure-u-md-3-8,
  .pure-u-md-9-24 {
    width: 37.5%;
    *width: 37.469%
  }
  .pure-u-md-2-5 {
    width: 40%;
    *width: 39.969%
  }
  .pure-u-md-5-12,
  .pure-u-md-10-24 {
    width: 41.6667%;
    *width: 41.6357%
  }
  .pure-u-md-11-24 {
    width: 45.8333%;
    *width: 45.8023%
  }
  .pure-u-md-1-2,
  .pure-u-md-12-24 {
    width: 50%;
    *width: 49.969%
  }
  .pure-u-md-13-24 {
    width: 54.1667%;
    *width: 54.1357%
  }
  .pure-u-md-7-12,
  .pure-u-md-14-24 {
    width: 58.3333%;
    *width: 58.3023%
  }
  .pure-u-md-3-5 {
    width: 60%;
    *width: 59.969%
  }
  .pure-u-md-5-8,
  .pure-u-md-15-24 {
    width: 62.5%;
    *width: 62.469%
  }
  .pure-u-md-2-3,
  .pure-u-md-16-24 {
    width: 66.6667%;
    *width: 66.6357%
  }
  .pure-u-md-17-24 {
    width: 70.8333%;
    *width: 70.8023%
  }
  .pure-u-md-3-4,
  .pure-u-md-18-24 {
    width: 75%;
    *width: 74.969%
  }
  .pure-u-md-19-24 {
    width: 79.1667%;
    *width: 79.1357%
  }
  .pure-u-md-4-5 {
    width: 80%;
    *width: 79.969%
  }
  .pure-u-md-5-6,
  .pure-u-md-20-24 {
    width: 83.3333%;
    *width: 83.3023%
  }
  .pure-u-md-7-8,
  .pure-u-md-21-24 {
    width: 87.5%;
    *width: 87.469%
  }
  .pure-u-md-11-12,
  .pure-u-md-22-24 {
    width: 91.6667%;
    *width: 91.6357%
  }
  .pure-u-md-23-24 {
    width: 95.8333%;
    *width: 95.8023%
  }
  .pure-u-md-1,
  .pure-u-md-1-1,
  .pure-u-md-5-5,
  .pure-u-md-24-24 {
    width: 100%
  }
}
@media screen and (min-width: 64em) {
  .pure-u-lg-1,
  .pure-u-lg-1-1,
  .pure-u-lg-1-2,
  .pure-u-lg-1-3,
  .pure-u-lg-2-3,
  .pure-u-lg-1-4,
  .pure-u-lg-3-4,
  .pure-u-lg-1-5,
  .pure-u-lg-2-5,
  .pure-u-lg-3-5,
  .pure-u-lg-4-5,
  .pure-u-lg-5-5,
  .pure-u-lg-1-6,
  .pure-u-lg-5-6,
  .pure-u-lg-1-8,
  .pure-u-lg-3-8,
  .pure-u-lg-5-8,
  .pure-u-lg-7-8,
  .pure-u-lg-1-12,
  .pure-u-lg-5-12,
  .pure-u-lg-7-12,
  .pure-u-lg-11-12,
  .pure-u-lg-1-24,
  .pure-u-lg-2-24,
  .pure-u-lg-3-24,
  .pure-u-lg-4-24,
  .pure-u-lg-5-24,
  .pure-u-lg-6-24,
  .pure-u-lg-7-24,
  .pure-u-lg-8-24,
  .pure-u-lg-9-24,
  .pure-u-lg-10-24,
  .pure-u-lg-11-24,
  .pure-u-lg-12-24,
  .pure-u-lg-13-24,
  .pure-u-lg-14-24,
  .pure-u-lg-15-24,
  .pure-u-lg-16-24,
  .pure-u-lg-17-24,
  .pure-u-lg-18-24,
  .pure-u-lg-19-24,
  .pure-u-lg-20-24,
  .pure-u-lg-21-24,
  .pure-u-lg-22-24,
  .pure-u-lg-23-24,
  .pure-u-lg-24-24 {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: top;
    text-rendering: auto
  }
  .pure-u-lg-1-24 {
    width: 4.1667%;
    *width: 4.1357%
  }
  .pure-u-lg-1-12,
  .pure-u-lg-2-24 {
    width: 8.3333%;
    *width: 8.3023%
  }
  .pure-u-lg-1-8,
  .pure-u-lg-3-24 {
    width: 12.5%;
    *width: 12.469%
  }
  .pure-u-lg-1-6,
  .pure-u-lg-4-24 {
    width: 16.6667%;
    *width: 16.6357%
  }
  .pure-u-lg-1-5 {
    width: 20%;
    *width: 19.969%
  }
  .pure-u-lg-5-24 {
    width: 20.8333%;
    *width: 20.8023%
  }
  .pure-u-lg-1-4,
  .pure-u-lg-6-24 {
    width: 25%;
    *width: 24.969%
  }
  .pure-u-lg-7-24 {
    width: 29.1667%;
    *width: 29.1357%
  }
  .pure-u-lg-1-3,
  .pure-u-lg-8-24 {
    width: 33.3333%;
    *width: 33.3023%
  }
  .pure-u-lg-3-8,
  .pure-u-lg-9-24 {
    width: 37.5%;
    *width: 37.469%
  }
  .pure-u-lg-2-5 {
    width: 40%;
    *width: 39.969%
  }
  .pure-u-lg-5-12,
  .pure-u-lg-10-24 {
    width: 41.6667%;
    *width: 41.6357%
  }
  .pure-u-lg-11-24 {
    width: 45.8333%;
    *width: 45.8023%
  }
  .pure-u-lg-1-2,
  .pure-u-lg-12-24 {
    width: 50%;
    *width: 49.969%
  }
  .pure-u-lg-13-24 {
    width: 54.1667%;
    *width: 54.1357%
  }
  .pure-u-lg-7-12,
  .pure-u-lg-14-24 {
    width: 58.3333%;
    *width: 58.3023%
  }
  .pure-u-lg-3-5 {
    width: 60%;
    *width: 59.969%
  }
  .pure-u-lg-5-8,
  .pure-u-lg-15-24 {
    width: 62.5%;
    *width: 62.469%
  }
  .pure-u-lg-2-3,
  .pure-u-lg-16-24 {
    width: 66.6667%;
    *width: 66.6357%
  }
  .pure-u-lg-17-24 {
    width: 70.8333%;
    *width: 70.8023%
  }
  .pure-u-lg-3-4,
  .pure-u-lg-18-24 {
    width: 75%;
    *width: 74.969%
  }
  .pure-u-lg-19-24 {
    width: 79.1667%;
    *width: 79.1357%
  }
  .pure-u-lg-4-5 {
    width: 80%;
    *width: 79.969%
  }
  .pure-u-lg-5-6,
  .pure-u-lg-20-24 {
    width: 83.3333%;
    *width: 83.3023%
  }
  .pure-u-lg-7-8,
  .pure-u-lg-21-24 {
    width: 87.5%;
    *width: 87.469%
  }
  .pure-u-lg-11-12,
  .pure-u-lg-22-24 {
    width: 91.6667%;
    *width: 91.6357%
  }
  .pure-u-lg-23-24 {
    width: 95.8333%;
    *width: 95.8023%
  }
  .pure-u-lg-1,
  .pure-u-lg-1-1,
  .pure-u-lg-5-5,
  .pure-u-lg-24-24 {
    width: 100%
  }
}
@media screen and (min-width: 80em) {
  .pure-u-xl-1,
  .pure-u-xl-1-1,
  .pure-u-xl-1-2,
  .pure-u-xl-1-3,
  .pure-u-xl-2-3,
  .pure-u-xl-1-4,
  .pure-u-xl-3-4,
  .pure-u-xl-1-5,
  .pure-u-xl-2-5,
  .pure-u-xl-3-5,
  .pure-u-xl-4-5,
  .pure-u-xl-5-5,
  .pure-u-xl-1-6,
  .pure-u-xl-5-6,
  .pure-u-xl-1-8,
  .pure-u-xl-3-8,
  .pure-u-xl-5-8,
  .pure-u-xl-7-8,
  .pure-u-xl-1-12,
  .pure-u-xl-5-12,
  .pure-u-xl-7-12,
  .pure-u-xl-11-12,
  .pure-u-xl-1-24,
  .pure-u-xl-2-24,
  .pure-u-xl-3-24,
  .pure-u-xl-4-24,
  .pure-u-xl-5-24,
  .pure-u-xl-6-24,
  .pure-u-xl-7-24,
  .pure-u-xl-8-24,
  .pure-u-xl-9-24,
  .pure-u-xl-10-24,
  .pure-u-xl-11-24,
  .pure-u-xl-12-24,
  .pure-u-xl-13-24,
  .pure-u-xl-14-24,
  .pure-u-xl-15-24,
  .pure-u-xl-16-24,
  .pure-u-xl-17-24,
  .pure-u-xl-18-24,
  .pure-u-xl-19-24,
  .pure-u-xl-20-24,
  .pure-u-xl-21-24,
  .pure-u-xl-22-24,
  .pure-u-xl-23-24,
  .pure-u-xl-24-24 {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: top;
    text-rendering: auto
  }
  .pure-u-xl-1-24 {
    width: 4.1667%;
    *width: 4.1357%
  }
  .pure-u-xl-1-12,
  .pure-u-xl-2-24 {
    width: 8.3333%;
    *width: 8.3023%
  }
  .pure-u-xl-1-8,
  .pure-u-xl-3-24 {
    width: 12.5%;
    *width: 12.469%
  }
  .pure-u-xl-1-6,
  .pure-u-xl-4-24 {
    width: 16.6667%;
    *width: 16.6357%
  }
  .pure-u-xl-1-5 {
    width: 20%;
    *width: 19.969%
  }
  .pure-u-xl-5-24 {
    width: 20.8333%;
    *width: 20.8023%
  }
  .pure-u-xl-1-4,
  .pure-u-xl-6-24 {
    width: 25%;
    *width: 24.969%
  }
  .pure-u-xl-7-24 {
    width: 29.1667%;
    *width: 29.1357%
  }
  .pure-u-xl-1-3,
  .pure-u-xl-8-24 {
    width: 33.3333%;
    *width: 33.3023%
  }
  .pure-u-xl-3-8,
  .pure-u-xl-9-24 {
    width: 37.5%;
    *width: 37.469%
  }
  .pure-u-xl-2-5 {
    width: 40%;
    *width: 39.969%
  }
  .pure-u-xl-5-12,
  .pure-u-xl-10-24 {
    width: 41.6667%;
    *width: 41.6357%
  }
  .pure-u-xl-11-24 {
    width: 45.8333%;
    *width: 45.8023%
  }
  .pure-u-xl-1-2,
  .pure-u-xl-12-24 {
    width: 50%;
    *width: 49.969%
  }
  .pure-u-xl-13-24 {
    width: 54.1667%;
    *width: 54.1357%
  }
  .pure-u-xl-7-12,
  .pure-u-xl-14-24 {
    width: 58.3333%;
    *width: 58.3023%
  }
  .pure-u-xl-3-5 {
    width: 60%;
    *width: 59.969%
  }
  .pure-u-xl-5-8,
  .pure-u-xl-15-24 {
    width: 62.5%;
    *width: 62.469%
  }
  .pure-u-xl-2-3,
  .pure-u-xl-16-24 {
    width: 66.6667%;
    *width: 66.6357%
  }
  .pure-u-xl-17-24 {
    width: 70.8333%;
    *width: 70.8023%
  }
  .pure-u-xl-3-4,
  .pure-u-xl-18-24 {
    width: 75%;
    *width: 74.969%
  }
  .pure-u-xl-19-24 {
    width: 79.1667%;
    *width: 79.1357%
  }
  .pure-u-xl-4-5 {
    width: 80%;
    *width: 79.969%
  }
  .pure-u-xl-5-6,
  .pure-u-xl-20-24 {
    width: 83.3333%;
    *width: 83.3023%
  }
  .pure-u-xl-7-8,
  .pure-u-xl-21-24 {
    width: 87.5%;
    *width: 87.469%
  }
  .pure-u-xl-11-12,
  .pure-u-xl-22-24 {
    width: 91.6667%;
    *width: 91.6357%
  }
  .pure-u-xl-23-24 {
    width: 95.8333%;
    *width: 95.8023%
  }
  .pure-u-xl-1,
  .pure-u-xl-1-1,
  .pure-u-xl-5-5,
  .pure-u-xl-24-24 {
    width: 100%
  }
}
html {
  font-size: 112.5%;
  line-height: 1.55556em
}
.pure-g {
  letter-spacing: -4px;
  display: flex;
  flex-wrap: wrap
}
.pure-g div,
.pure-g h1,
.pure-g h2,
.pure-g h3,
.pure-g h4,
.pure-g p,
.pure-g span,
.pure-g label,
.pure-g a,
.pure-g ul,
.pure-g ol,
.pure-g li {
  letter-spacing: 0.2px
}
.pure-g.gutters {
  margin: 0 -0.1em
}
.pure-g.gutters > [class*=pure-u] {
  box-sizing: border-box;
  padding: 0 0.5em
}
.l-box {
  padding: 0.5em
}
body {
  font-family: 'Lato', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #606363;
  font-weight: 400;
  letter-spacing: 0.2px
}
body p {
  margin: 28px 0em
}
a {
  color: #22a0c7;
  text-decoration: none
}
a > svg.arrow-right,
a > img.arrow-right {
  margin: 0px 0px -1px 5px;
  stroke: #22a0c7
}
a:hover {
  text-decoration: underline
}
a.report-link {
  display: block
}
.menu-icon {
  float: right;
  margin-top: 13px;
  cursor: pointer;
  display: none
}
.mobile-reports h3 {
  margin-bottom: 0 !important
}
.mobile-reports h4 {
  margin-top: 6px !important;
  font-weight: normal !important
}
#mobile-menu {
  position: fixed;
  text-align: left;
  z-index: 110;
  top: 0px;
  right: -264px;
  min-width: 254px;
  height: 100%;
  overflow: scroll;
  display: block;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  background-color: white;
  -moz-box-shadow: rgba(0, 0, 0, 0.18) 0px 0px 16px, rgba(0, 0, 0, 0.24) 0px 16px 16px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.18) 0px 0px 16px, rgba(0, 0, 0, 0.24) 0px 16px 16px;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 0px 16px, rgba(0, 0, 0, 0.24) 0px 16px 16px
}
#mobile-menu ul {
  padding: 0rem;
  margin: 0rem
}
#mobile-menu ul li {
  list-style: none
}
#mobile-menu ul li a {
  color: #606363;
  font-size: 20px;
  line-height: 28px;
  padding: 14px 28px;
  display: block
}
#mobile-menu ul li a:hover,
#mobile-menu ul li a.active {
  background-color: #22a0c7;
  color: #fff;
  text-decoration: none
}
#mobile-menu ul li a:hover svg,
#mobile-menu ul li a.active svg {
  fill: #fff
}
#mobile-menu ul li a:active {
  background: #1e90b3;
  color: #e5e5e5
}
#mobile-menu ul li a:active svg {
  fill: #e5e5e5
}
#mobile-menu ul li a svg {
  margin-top: -3px;
  vertical-align: middle
}
#mobile-menu ul li.last-element {
  margin-bottom: 56px
}
#mobile-menu ul li.accordion {
  display: none
}
#mobile-menu ul li.accordion li > a {
  font-size: 14px;
  padding: 0px 56px
}
#mobile-menu ul li.accordion li > a:hover,
#mobile-menu ul li.accordion li > a.active {
  background-color: #fff;
  color: #22a0c7
}
#mobile-menu ul li.accordion li > a:active {
  color: #1e90b3
}
#cookie-consent {
  position: fixed;
  z-index: 999;
  bottom: 0;
  left: 0;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.9);
  border-top: 1px solid #22a0c7;
  width: 90%;
  padding: 0% 5%;
  display: none
}
#cookie-consent p {
  font-size: 16px;
  line-height: 56px;
  text-align: center;
  margin: 0px
}
.white-section,
.grey-section,
.grey-gradient-section,
.green-gradient,
.purple-gradient,
.case-gradient,
.navy-gradient,
.blue-gradient,
.lp-hero {
  clear: both;
  width: 100%
}
.white-section > div,
.grey-section > div,
.grey-gradient-section > div,
.green-gradient > div,
.purple-gradient > div,
.case-gradient > div,
.navy-gradient > div,
.blue-gradient > div,
.lp-hero > div {
  margin: 0rem auto;
  width: 90%;
  max-width: 1100px;
  text-align: center;
  padding-top: 3.11111em;
  padding-bottom: 3.11111em
}
.white-section > div.breadcrumb,
.grey-section > div.breadcrumb,
.grey-gradient-section > div.breadcrumb,
.green-gradient > div.breadcrumb,
.purple-gradient > div.breadcrumb,
.case-gradient > div.breadcrumb,
.navy-gradient > div.breadcrumb,
.blue-gradient > div.breadcrumb,
.lp-hero > div.breadcrumb {
  width: 100%;
  max-width: 100%;
  background: rgba(255, 255, 255, 0.3);
  padding: 0em
}
.white-section > div.breadcrumb > div,
.grey-section > div.breadcrumb > div,
.grey-gradient-section > div.breadcrumb > div,
.green-gradient > div.breadcrumb > div,
.purple-gradient > div.breadcrumb > div,
.case-gradient > div.breadcrumb > div,
.navy-gradient > div.breadcrumb > div,
.blue-gradient > div.breadcrumb > div,
.lp-hero > div.breadcrumb > div {
  max-width: 1100px;
  margin: 0rem auto;
  width: 90%
}
.white-section > div.breadcrumb > div > a,
.grey-section > div.breadcrumb > div > a,
.grey-gradient-section > div.breadcrumb > div > a,
.green-gradient > div.breadcrumb > div > a,
.purple-gradient > div.breadcrumb > div > a,
.case-gradient > div.breadcrumb > div > a,
.navy-gradient > div.breadcrumb > div > a,
.blue-gradient > div.breadcrumb > div > a,
.lp-hero > div.breadcrumb > div > a {
  color: #fff;
  line-height: 3.15
}
.white-section > div.breadcrumb > div > a + a,
.grey-section > div.breadcrumb > div > a + a,
.grey-gradient-section > div.breadcrumb > div > a + a,
.green-gradient > div.breadcrumb > div > a + a,
.purple-gradient > div.breadcrumb > div > a + a,
.case-gradient > div.breadcrumb > div > a + a,
.navy-gradient > div.breadcrumb > div > a + a,
.blue-gradient > div.breadcrumb > div > a + a,
.lp-hero > div.breadcrumb > div > a + a {
  padding-left: 24px;
  background-repeat: no-repeat;
  background-position: 11px 9px
}
.white-section > div > div,
.grey-section > div > div,
.grey-gradient-section > div > div,
.green-gradient > div > div,
.purple-gradient > div > div,
.case-gradient > div > div,
.navy-gradient > div > div,
.blue-gradient > div > div,
.lp-hero > div > div {
  text-align: left
}
.white-section > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.grey-section > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.grey-gradient-section > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.green-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.purple-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.case-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.navy-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.blue-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
.lp-hero > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24 {
  margin-left: 0%
}
.white-section > div.first,
.grey-section > div.first,
.grey-gradient-section > div.first,
.green-gradient > div.first,
.purple-gradient > div.first,
.case-gradient > div.first,
.navy-gradient > div.first,
.blue-gradient > div.first,
.lp-hero > div.first {
  padding-top: 6.22222em
}
.white-section > div h1,
.grey-section > div h1,
.grey-gradient-section > div h1,
.green-gradient > div h1,
.purple-gradient > div h1,
.case-gradient > div h1,
.navy-gradient > div h1,
.blue-gradient > div h1,
.lp-hero > div h1 {
  font-size: 2.66667em;
  line-height: 1.16667em
}
.white-section > div h2,
.grey-section > div h2,
.grey-gradient-section > div h2,
.green-gradient > div h2,
.purple-gradient > div h2,
.case-gradient > div h2,
.navy-gradient > div h2,
.blue-gradient > div h2,
.lp-hero > div h2 {
  font-size: 1.77778em;
  line-height: 1.75em
}
.white-section > div h3,
.grey-section > div h3,
.grey-gradient-section > div h3,
.green-gradient > div h3,
.purple-gradient > div h3,
.case-gradient > div h3,
.navy-gradient > div h3,
.blue-gradient > div h3,
.lp-hero > div h3 {
  font-size: 1.22222em;
  line-height: 1.27273em
}
.white-section > div h1,
.white-section > div h2,
.white-section > div h3,
.grey-section > div h1,
.grey-section > div h2,
.grey-section > div h3,
.grey-gradient-section > div h1,
.grey-gradient-section > div h2,
.grey-gradient-section > div h3,
.green-gradient > div h1,
.green-gradient > div h2,
.green-gradient > div h3,
.purple-gradient > div h1,
.purple-gradient > div h2,
.purple-gradient > div h3,
.case-gradient > div h1,
.case-gradient > div h2,
.case-gradient > div h3,
.navy-gradient > div h1,
.navy-gradient > div h2,
.navy-gradient > div h3,
.blue-gradient > div h1,
.blue-gradient > div h2,
.blue-gradient > div h3,
.lp-hero > div h1,
.lp-hero > div h2,
.lp-hero > div h3 {
  font-weight: 400;
  color: #22a0c7;
  margin: 28px auto
}
.white-section > div svg.arrow-right,
.grey-section > div svg.arrow-right,
.grey-gradient-section > div svg.arrow-right,
.green-gradient > div svg.arrow-right,
.purple-gradient > div svg.arrow-right,
.case-gradient > div svg.arrow-right,
.navy-gradient > div svg.arrow-right,
.blue-gradient > div svg.arrow-right,
.lp-hero > div svg.arrow-right {
  stroke: #22a0c7;
  transition: all .3s ease
}
.white-section > div h4,
.grey-section > div h4,
.grey-gradient-section > div h4,
.green-gradient > div h4,
.purple-gradient > div h4,
.case-gradient > div h4,
.navy-gradient > div h4,
.blue-gradient > div h4,
.lp-hero > div h4 {
  margin: 28px auto
}
.white-section > div div.image-right,
.white-section > div div.image-left,
.white-section > div div.wide-image-right,
.white-section > div div.wide-image-left,
.grey-section > div div.image-right,
.grey-section > div div.image-left,
.grey-section > div div.wide-image-right,
.grey-section > div div.wide-image-left,
.grey-gradient-section > div div.image-right,
.grey-gradient-section > div div.image-left,
.grey-gradient-section > div div.wide-image-right,
.grey-gradient-section > div div.wide-image-left,
.green-gradient > div div.image-right,
.green-gradient > div div.image-left,
.green-gradient > div div.wide-image-right,
.green-gradient > div div.wide-image-left,
.purple-gradient > div div.image-right,
.purple-gradient > div div.image-left,
.purple-gradient > div div.wide-image-right,
.purple-gradient > div div.wide-image-left,
.case-gradient > div div.image-right,
.case-gradient > div div.image-left,
.case-gradient > div div.wide-image-right,
.case-gradient > div div.wide-image-left,
.navy-gradient > div div.image-right,
.navy-gradient > div div.image-left,
.navy-gradient > div div.wide-image-right,
.navy-gradient > div div.wide-image-left,
.blue-gradient > div div.image-right,
.blue-gradient > div div.image-left,
.blue-gradient > div div.wide-image-right,
.blue-gradient > div div.wide-image-left,
.lp-hero > div div.image-right,
.lp-hero > div div.image-left,
.lp-hero > div div.wide-image-right,
.lp-hero > div div.wide-image-left {
  margin: 28px auto;
  text-align: center
}
.white-section > div div.wide-image-right > div,
.white-section > div div.wide-image-left > div,
.grey-section > div div.wide-image-right > div,
.grey-section > div div.wide-image-left > div,
.grey-gradient-section > div div.wide-image-right > div,
.grey-gradient-section > div div.wide-image-left > div,
.green-gradient > div div.wide-image-right > div,
.green-gradient > div div.wide-image-left > div,
.purple-gradient > div div.wide-image-right > div,
.purple-gradient > div div.wide-image-left > div,
.case-gradient > div div.wide-image-right > div,
.case-gradient > div div.wide-image-left > div,
.navy-gradient > div div.wide-image-right > div,
.navy-gradient > div div.wide-image-left > div,
.blue-gradient > div div.wide-image-right > div,
.blue-gradient > div div.wide-image-left > div,
.lp-hero > div div.wide-image-right > div,
.lp-hero > div div.wide-image-left > div {
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  overflow: hidden;
  -moz-box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px
}
.white-section > div div.wide-image-right img,
.white-section > div div.wide-image-left img,
.grey-section > div div.wide-image-right img,
.grey-section > div div.wide-image-left img,
.grey-gradient-section > div div.wide-image-right img,
.grey-gradient-section > div div.wide-image-left img,
.green-gradient > div div.wide-image-right img,
.green-gradient > div div.wide-image-left img,
.purple-gradient > div div.wide-image-right img,
.purple-gradient > div div.wide-image-left img,
.case-gradient > div div.wide-image-right img,
.case-gradient > div div.wide-image-left img,
.navy-gradient > div div.wide-image-right img,
.navy-gradient > div div.wide-image-left img,
.blue-gradient > div div.wide-image-right img,
.blue-gradient > div div.wide-image-left img,
.lp-hero > div div.wide-image-right img,
.lp-hero > div div.wide-image-left img {
  max-width: 100%;
  vertical-align: middle
}
.white-section .narrow,
.grey-section .narrow,
.grey-gradient-section .narrow,
.green-gradient .narrow,
.purple-gradient .narrow,
.case-gradient .narrow,
.navy-gradient .narrow,
.blue-gradient .narrow,
.lp-hero .narrow {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto
}
.white-section.purple > div h1,
.white-section.purple > div h2,
.white-section.purple > div h3,
.white-section.purple > div a,
.grey-section.purple > div h1,
.grey-section.purple > div h2,
.grey-section.purple > div h3,
.grey-section.purple > div a,
.grey-gradient-section.purple > div h1,
.grey-gradient-section.purple > div h2,
.grey-gradient-section.purple > div h3,
.grey-gradient-section.purple > div a,
.green-gradient.purple > div h1,
.green-gradient.purple > div h2,
.green-gradient.purple > div h3,
.green-gradient.purple > div a,
.purple-gradient.purple > div h1,
.purple-gradient.purple > div h2,
.purple-gradient.purple > div h3,
.purple-gradient.purple > div a,
.case-gradient.purple > div h1,
.case-gradient.purple > div h2,
.case-gradient.purple > div h3,
.case-gradient.purple > div a,
.navy-gradient.purple > div h1,
.navy-gradient.purple > div h2,
.navy-gradient.purple > div h3,
.navy-gradient.purple > div a,
.blue-gradient.purple > div h1,
.blue-gradient.purple > div h2,
.blue-gradient.purple > div h3,
.blue-gradient.purple > div a,
.lp-hero.purple > div h1,
.lp-hero.purple > div h2,
.lp-hero.purple > div h3,
.lp-hero.purple > div a {
  color: #aa4ea2
}
.white-section.purple svg.arrow-right,
.grey-section.purple svg.arrow-right,
.grey-gradient-section.purple svg.arrow-right,
.green-gradient.purple svg.arrow-right,
.purple-gradient.purple svg.arrow-right,
.case-gradient.purple svg.arrow-right,
.navy-gradient.purple svg.arrow-right,
.blue-gradient.purple svg.arrow-right,
.lp-hero.purple svg.arrow-right {
  stroke: #aa4ea2
}
.white-section.navy > div h1,
.white-section.navy > div h2,
.white-section.navy > div h3,
.white-section.navy > div a,
.grey-section.navy > div h1,
.grey-section.navy > div h2,
.grey-section.navy > div h3,
.grey-section.navy > div a,
.grey-gradient-section.navy > div h1,
.grey-gradient-section.navy > div h2,
.grey-gradient-section.navy > div h3,
.grey-gradient-section.navy > div a,
.green-gradient.navy > div h1,
.green-gradient.navy > div h2,
.green-gradient.navy > div h3,
.green-gradient.navy > div a,
.purple-gradient.navy > div h1,
.purple-gradient.navy > div h2,
.purple-gradient.navy > div h3,
.purple-gradient.navy > div a,
.case-gradient.navy > div h1,
.case-gradient.navy > div h2,
.case-gradient.navy > div h3,
.case-gradient.navy > div a,
.navy-gradient.navy > div h1,
.navy-gradient.navy > div h2,
.navy-gradient.navy > div h3,
.navy-gradient.navy > div a,
.blue-gradient.navy > div h1,
.blue-gradient.navy > div h2,
.blue-gradient.navy > div h3,
.blue-gradient.navy > div a,
.lp-hero.navy > div h1,
.lp-hero.navy > div h2,
.lp-hero.navy > div h3,
.lp-hero.navy > div a {
  color: #4573a9
}
.white-section.navy svg.arrow-right,
.grey-section.navy svg.arrow-right,
.grey-gradient-section.navy svg.arrow-right,
.green-gradient.navy svg.arrow-right,
.purple-gradient.navy svg.arrow-right,
.case-gradient.navy svg.arrow-right,
.navy-gradient.navy svg.arrow-right,
.blue-gradient.navy svg.arrow-right,
.lp-hero.navy svg.arrow-right {
  stroke: #4573a9
}
.white-section.blue > div h1,
.white-section.blue > div h2,
.white-section.blue > div h3,
.white-section.blue > div a,
.grey-section.blue > div h1,
.grey-section.blue > div h2,
.grey-section.blue > div h3,
.grey-section.blue > div a,
.grey-gradient-section.blue > div h1,
.grey-gradient-section.blue > div h2,
.grey-gradient-section.blue > div h3,
.grey-gradient-section.blue > div a,
.green-gradient.blue > div h1,
.green-gradient.blue > div h2,
.green-gradient.blue > div h3,
.green-gradient.blue > div a,
.purple-gradient.blue > div h1,
.purple-gradient.blue > div h2,
.purple-gradient.blue > div h3,
.purple-gradient.blue > div a,
.case-gradient.blue > div h1,
.case-gradient.blue > div h2,
.case-gradient.blue > div h3,
.case-gradient.blue > div a,
.navy-gradient.blue > div h1,
.navy-gradient.blue > div h2,
.navy-gradient.blue > div h3,
.navy-gradient.blue > div a,
.blue-gradient.blue > div h1,
.blue-gradient.blue > div h2,
.blue-gradient.blue > div h3,
.blue-gradient.blue > div a,
.lp-hero.blue > div h1,
.lp-hero.blue > div h2,
.lp-hero.blue > div h3,
.lp-hero.blue > div a {
  color: #4467d3
}
.white-section.blue svg.arrow-right,
.grey-section.blue svg.arrow-right,
.grey-gradient-section.blue svg.arrow-right,
.green-gradient.blue svg.arrow-right,
.purple-gradient.blue svg.arrow-right,
.case-gradient.blue svg.arrow-right,
.navy-gradient.blue svg.arrow-right,
.blue-gradient.blue svg.arrow-right,
.lp-hero.blue svg.arrow-right {
  stroke: #4467d3
}
.white-section {
  background-color: white
}
.grey-section {
  background-color: #f9f9f9
}
.green-gradient {
  background-color: #22a0c7;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIzYWM5ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIxOTRmMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #23ac9d, #2194f1);
  background-image: -webkit-linear-gradient(315deg, #23ac9d, #2194f1);
  background-image: linear-gradient(135deg, #23ac9d, #2194f1)
}
.green-gradient > div p {
  color: #d2ecf3
}
.purple-gradient {
  background-color: #aa4ea2;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlNjI5MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzY3M2FiNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #ee6290, #673ab5);
  background-image: -webkit-linear-gradient(315deg, #ee6290, #673ab5);
  background-image: linear-gradient(135deg, #ee6290, #673ab5)
}
.purple-gradient > div p {
  color: #eedbec
}
.purple-gradient > div svg.arrow-right {
  stroke: #aa4ea2
}
.navy-gradient {
  background-color: #4573a9;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIzYWM5ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzY3M2FiNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #23ac9d, #673ab5);
  background-image: -webkit-linear-gradient(315deg, #23ac9d, #673ab5);
  background-image: linear-gradient(135deg, #23ac9d, #673ab5)
}
.navy-gradient > div p {
  color: #d9e3ed
}
.navy-gradient > div svg.arrow-right {
  stroke: #4573a9
}
.blue-gradient {
  background-color: #4467d3;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIxOTRmMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzY3M2FiNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #2194f1, #673ab5);
  background-image: -webkit-linear-gradient(315deg, #2194f1, #673ab5);
  background-image: linear-gradient(135deg, #2194f1, #673ab5)
}
.blue-gradient > div p {
  color: #d9e0f6
}
.blue-gradient > div svg.arrow-right {
  stroke: #aa4ea2
}
.green-gradient > div h1,
.green-gradient > div h2,
.green-gradient > div h3,
.purple-gradient > div h1,
.purple-gradient > div h2,
.purple-gradient > div h3,
.case-gradient > div h1,
.case-gradient > div h2,
.case-gradient > div h3,
.navy-gradient > div h1,
.navy-gradient > div h2,
.navy-gradient > div h3,
.blue-gradient > div h1,
.blue-gradient > div h2,
.blue-gradient > div h3 {
  color: #fff
}
.green-gradient > div p,
.purple-gradient > div p,
.case-gradient > div p,
.navy-gradient > div p,
.blue-gradient > div p {
  color: rgba(255, 255, 255, 0.8)
}
.green-gradient > div p a,
.purple-gradient > div p a,
.case-gradient > div p a,
.navy-gradient > div p a,
.blue-gradient > div p a {
  color: #fff
}
.grey-gradient-section {
  background-color: white;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UyZTJlMiIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e2e2e2), color-stop(50%, #fff));
  background-image: -moz-linear-gradient(#e2e2e2, #fff 50%);
  background-image: -webkit-linear-gradient(#e2e2e2, #fff 50%);
  background-image: linear-gradient(#e2e2e2, #fff 50%)
}
.svg-supported .breadcrumb a + a {
  background-image: url("/sites/deviceatlas.com/themes/brewdock/images/static-pages/icons/breadcrumb-arrow.svg")
}
.svg-unsupported .breadcrumb a + a {
  background-image: url("/sites/deviceatlas.com/themes/brewdock/images/static-pages/icons/breadcrumb-arrow.png")
}
#footer {
  background-color: #393d3d;
  font-size: 14px;
  color: #d7d8d8
}
#footer > div + div {
  background-color: #1c1e1e
}
#footer > div > div {
  width: 90%;
  max-width: 1100px;
  margin: 0em auto
}
#footer > div > .links a {
  color: #d7d8d8
}
#footer > div > .links a:hover {
  color: #fff
}
#footer > div > .links a:hover path {
  fill: #fff !important
}
#footer > div > .links div + div {
  text-align: right
}
#footer > div > .links div + div a {
  margin-top: 14px;
  display: inline-block
}
#footer > div > .links div + div a + a {
  margin-left: 14px
}
#footer > div > .afilias-links {
  padding: 28px 0px
}
#footer > div > .afilias-links svg,
#footer > div > .afilias-links img {
  margin-top: 7px
}
#footer > div > .copyright {
  font-size: 12px;
  padding-bottom: 28px
}
#footer > div > .copyright div + div {
  text-align: right
}
#footer > div > .copyright a {
  text-decoration: underline
}
#footer > div ul {
  margin: 14px 0px;
  padding: 0px;
  list-style: none
}
#footer > div ul li {
  display: inline-block
}
#footer > div ul li + li {
  margin-left: 14px
}
#footer p,
#footer h4 {
  margin: 0px
}
#vertical-form {
  position: relative
}
#vertical-form > div h2,
#vertical-form > div p {
  max-width: 700px
}
#vertical-form > div h2.larger,
#vertical-form > div p.larger {
  font-size: 1.22222em;
  line-height: 1.27273em
}
#vertical-form > div > form {
  margin: 28px auto;
  position: relative
}
#vertical-form > div > form label {
  font-size: 0.77778em;
  line-height: 2em;
  text-transform: uppercase
}
#vertical-form > div > form label > span {
  font-size: 18px;
  color: #22a0c7
}
#vertical-form > div > form label[for="uptodate"] {
  text-transform: none
}
#vertical-form > div > form label > svg {
  stroke: #22a0c7
}
#vertical-form > div > form > div > div {
  text-align: left;
  position: relative
}
#vertical-form > div > form > div > div + div {
  margin-left: 0%
}
#vertical-form > div > form textarea {
  min-height: 140px;
  display: block
}
#vertical-form > div > form input,
#vertical-form > div > form textarea {
  -moz-transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), box-shadow 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12);
  -o-transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), box-shadow 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12);
  -webkit-transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), box-shadow 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12);
  transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), box-shadow 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12)
}
#vertical-form > div > form input.error,
#vertical-form > div > form textarea.error {
  background-color: #ffcdd2;
  color: #f44336;
  border-color: #f44336
}
#vertical-form > div > form .submit-container {
  text-align: right
}
#vertical-form > div > form .agreement {
  font-size: 0.73em !important;
  margin: 0
}
#vertical-form > div > form p.error {
  position: absolute;
  bottom: 0px;
  left: 0px;
  margin: 0px;
  font-size: 14px;
  color: #f44336;
  display: none
}
#vertical-form > div > form.successful > div.pure-g {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=10);
  opacity: 0.1
}
#vertical-form > div > form > .success-message {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  max-height: 186px
}
#vertical-form .form-error {
  width: 90%;
  padding: 5%;
  padding-top: 1.55556em;
  padding-bottom: 1.55556em;
  text-align: left;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  background-color: #ffcdd2;
  color: #f44336;
  border: 1px solid #f44336
}
#vertical-form.purple label > span {
  color: #aa4ea2
}
#vertical-form.purple label > svg {
  stroke: #aa4ea2
}
#vertical-form.purple input[type="text"]:focus,
#vertical-form.purple input[type="email"]:focus,
#vertical-form.purple textarea:focus {
  border-color: #aa4ea2
}
#vertical-form.navy label > span {
  color: #4573a9
}
#vertical-form.navy label > svg {
  stroke: #4573a9
}
#vertical-form.navy input[type="text"]:focus,
#vertical-form.navy input[type="email"]:focus,
#vertical-form.navy textarea:focus {
  border-color: #4573a9
}
#vertical-form.blue label > span {
  color: #4467d3
}
#vertical-form.blue label > svg {
  stroke: #4467d3
}
#vertical-form.blue input[type="text"]:focus,
#vertical-form.blue input[type="email"]:focus,
#vertical-form.blue textarea:focus {
  border-color: #4467d3
}
#vertical-form.grey-section input[type='text'],
#vertical-form.grey-section input[type='email'],
#vertical-form.grey-section input[type='password'],
#vertical-form.grey-section textarea,
#vertical-form.grey-section > div > form input[type="checkbox"] + label {
  background-color: #fff !important
}
#form-scroll-marker,
.scroll-marker {
  position: absolute;
  display: block;
  width: 0em;
  height: 0em;
  left: 0em;
  top: -56px
}
input[type='text'],
input[type='email'],
input[type='password'],
select,
textarea {
  width: 100%;
  border: 1px solid #c9c9c9;
  background-color: #f9f9f9;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  margin-bottom: 28px;
  line-height: 28px;
  padding: 13px 14px;
  outline: none
}
input[type='text']:focus,
input[type='email']:focus,
input[type='password']:focus,
select:focus,
textarea:focus {
  border-color: #22a0c7
}
input[type="submit"] {
  outline: none
}
.green-cta,
input[type="submit"],
.purple-cta,
#vertical-form.purple input[type="submit"],
.navy-cta,
#vertical-form.navy input[type="submit"],
.blue-cta,
#vertical-form.blue input[type="submit"],
.black-cta,
.white-green-cta,
.white-purple-cta,
.white-navy-cta,
.white-blue-cta,
.white-black-cta,
.outlined-green-cta,
.outlined-purple-cta,
.outlined-navy-cta,
.outlined-blue-cta,
.outlined-black-cta {
  display: inline-block;
  font-weight: 700;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  font-size: 14px;
  line-height: 28px;
  text-transform: uppercase;
  padding: 6px 22px;
  cursor: pointer;
  margin: 8px 0px 36px 0px;
  border: 0px
}
.green-cta.small,
input.small[type="submit"],
.purple-cta.small,
#vertical-form.purple input.small[type="submit"],
.navy-cta.small,
#vertical-form.navy input.small[type="submit"],
.blue-cta.small,
#vertical-form.blue input.small[type="submit"],
.black-cta.small,
.white-green-cta.small,
.white-purple-cta.small,
.white-navy-cta.small,
.white-blue-cta.small,
.white-black-cta.small,
.outlined-green-cta.small,
.outlined-purple-cta.small,
.outlined-navy-cta.small,
.outlined-blue-cta.small,
.outlined-black-cta.small {
  padding: 1px 14px
}
.green-cta.middle,
input.middle[type="submit"],
.purple-cta.middle,
#vertical-form.purple input.middle[type="submit"],
.navy-cta.middle,
#vertical-form.navy input.middle[type="submit"],
.blue-cta.middle,
#vertical-form.blue input.middle[type="submit"],
.black-cta.middle,
.white-green-cta.middle,
.white-purple-cta.middle,
.white-navy-cta.middle,
.white-blue-cta.middle,
.white-black-cta.middle,
.outlined-green-cta.middle,
.outlined-purple-cta.middle,
.outlined-navy-cta.middle,
.outlined-blue-cta.middle,
.outlined-black-cta.middle {
  margin: 8px 0px
}
.green-cta.no-spacing,
input.no-spacing[type="submit"],
.purple-cta.no-spacing,
#vertical-form.purple input.no-spacing[type="submit"],
.navy-cta.no-spacing,
#vertical-form.navy input.no-spacing[type="submit"],
.blue-cta.no-spacing,
#vertical-form.blue input.no-spacing[type="submit"],
.black-cta.no-spacing,
.white-green-cta.no-spacing,
.white-purple-cta.no-spacing,
.white-navy-cta.no-spacing,
.white-blue-cta.no-spacing,
.white-black-cta.no-spacing,
.outlined-green-cta.no-spacing,
.outlined-purple-cta.no-spacing,
.outlined-navy-cta.no-spacing,
.outlined-blue-cta.no-spacing,
.outlined-black-cta.no-spacing {
  margin: 0em
}
.green-cta > .arrow-right,
input[type="submit"] > .arrow-right,
.purple-cta > .arrow-right,
#vertical-form.purple input[type="submit"] > .arrow-right,
.navy-cta > .arrow-right,
#vertical-form.navy input[type="submit"] > .arrow-right,
.blue-cta > .arrow-right,
#vertical-form.blue input[type="submit"] > .arrow-right,
.black-cta > .arrow-right,
.white-green-cta > .arrow-right,
.white-purple-cta > .arrow-right,
.white-navy-cta > .arrow-right,
.white-blue-cta > .arrow-right,
.white-black-cta > .arrow-right,
.outlined-green-cta > .arrow-right,
.outlined-purple-cta > .arrow-right,
.outlined-navy-cta > .arrow-right,
.outlined-blue-cta > .arrow-right,
.outlined-black-cta > .arrow-right {
  margin: 0px 0px -1px 5px
}
@media screen and (min-width: 330px) {
  .green-cta > .arrow-right.bigger,
  input[type="submit"] > .arrow-right.bigger,
  .purple-cta > .arrow-right.bigger,
  #vertical-form.purple input[type="submit"] > .arrow-right.bigger,
  .navy-cta > .arrow-right.bigger,
  #vertical-form.navy input[type="submit"] > .arrow-right.bigger,
  .blue-cta > .arrow-right.bigger,
  #vertical-form.blue input[type="submit"] > .arrow-right.bigger,
  .black-cta > .arrow-right.bigger,
  .white-green-cta > .arrow-right.bigger,
  .white-purple-cta > .arrow-right.bigger,
  .white-navy-cta > .arrow-right.bigger,
  .white-blue-cta > .arrow-right.bigger,
  .white-black-cta > .arrow-right.bigger,
  .outlined-green-cta > .arrow-right.bigger,
  .outlined-purple-cta > .arrow-right.bigger,
  .outlined-navy-cta > .arrow-right.bigger,
  .outlined-blue-cta > .arrow-right.bigger,
  .outlined-black-cta > .arrow-right.bigger {
    margin: 0px 0px 0px 7px;
    width: 16px;
    height: 14px
  }
}
@media screen and (max-width: 220px) {
  .green-cta > .arrow-right.bigger,
  input[type="submit"] > .arrow-right.bigger,
  .purple-cta > .arrow-right.bigger,
  #vertical-form.purple input[type="submit"] > .arrow-right.bigger,
  .navy-cta > .arrow-right.bigger,
  #vertical-form.navy input[type="submit"] > .arrow-right.bigger,
  .blue-cta > .arrow-right.bigger,
  #vertical-form.blue input[type="submit"] > .arrow-right.bigger,
  .black-cta > .arrow-right.bigger,
  .white-green-cta > .arrow-right.bigger,
  .white-purple-cta > .arrow-right.bigger,
  .white-navy-cta > .arrow-right.bigger,
  .white-blue-cta > .arrow-right.bigger,
  .white-black-cta > .arrow-right.bigger,
  .outlined-green-cta > .arrow-right.bigger,
  .outlined-purple-cta > .arrow-right.bigger,
  .outlined-navy-cta > .arrow-right.bigger,
  .outlined-blue-cta > .arrow-right.bigger,
  .outlined-black-cta > .arrow-right.bigger {
    display: none
  }
}
.green-cta:hover,
input[type="submit"]:hover,
.purple-cta:hover,
#vertical-form.purple input[type="submit"]:hover,
.navy-cta:hover,
#vertical-form.navy input[type="submit"]:hover,
.blue-cta:hover,
#vertical-form.blue input[type="submit"]:hover,
.black-cta:hover,
.white-green-cta:hover,
.white-purple-cta:hover,
.white-navy-cta:hover,
.white-blue-cta:hover,
.white-black-cta:hover,
.outlined-green-cta:hover,
.outlined-purple-cta:hover,
.outlined-navy-cta:hover,
.outlined-blue-cta:hover,
.outlined-black-cta:hover {
  text-decoration: none
}
@media screen and (min-width: 330px) {
  .green-cta.bigger,
  input.bigger[type="submit"],
  .purple-cta.bigger,
  #vertical-form.purple input.bigger[type="submit"],
  .navy-cta.bigger,
  #vertical-form.navy input.bigger[type="submit"],
  .blue-cta.bigger,
  #vertical-form.blue input.bigger[type="submit"],
  .black-cta.bigger,
  .white-green-cta.bigger,
  .white-purple-cta.bigger,
  .white-navy-cta.bigger,
  .white-blue-cta.bigger,
  .white-black-cta.bigger,
  .outlined-green-cta.bigger,
  .outlined-purple-cta.bigger,
  .outlined-navy-cta.bigger,
  .outlined-blue-cta.bigger,
  .outlined-black-cta.bigger {
    font-size: 18px;
    padding: 10px 22px
  }
}
.green-cta,
input[type="submit"],
.purple-cta,
#vertical-form.purple input[type="submit"],
.navy-cta,
#vertical-form.navy input[type="submit"],
.blue-cta,
#vertical-form.blue input[type="submit"],
.black-cta,
.white-green-cta,
.white-purple-cta,
.white-navy-cta,
.white-blue-cta,
.white-black-cta {
  -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease
}
.green-cta:hover,
input[type="submit"]:hover,
.purple-cta:hover,
#vertical-form.purple input[type="submit"]:hover,
.navy-cta:hover,
#vertical-form.navy input[type="submit"]:hover,
.blue-cta:hover,
#vertical-form.blue input[type="submit"]:hover,
.black-cta:hover,
.white-green-cta:hover,
.white-purple-cta:hover,
.white-navy-cta:hover,
.white-blue-cta:hover,
.white-black-cta:hover {
  -moz-box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px
}
.white-green-cta {
  color: #22a0c7 !important
}
.white-purple-cta:active {
  background-color: #e57cc4 !important
}
.white-purple-cta:hover {
  background-color: #f771ec;
  color: white !important;
  -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px
}
.white-purple-cta:hover > svg.arrow-right {
  stroke: white !important
}
.outlined-green-cta,
.outlined-purple-cta,
.outlined-navy-cta,
.outlined-blue-cta,
.outlined-black-cta {
  padding: 5px 21px
}
.green-cta,
input[type="submit"] {
  background: #22a0c7
}
.green-cta:active,
input[type="submit"]:active {
  background: #1e90b3
}
.purple-cta,
#vertical-form.purple input[type="submit"] {
  background: #aa4ea2
}
.purple-cta:active,
#vertical-form.purple input[type="submit"]:active {
  background: #994691
}
.navy-cta,
#vertical-form.navy input[type="submit"] {
  background: #4573a9
}
.navy-cta:active,
#vertical-form.navy input[type="submit"]:active {
  background: #3e6798
}
.blue-cta,
#vertical-form.blue input[type="submit"] {
  background: #4467d3
}
.blue-cta:active,
#vertical-form.blue input[type="submit"]:active {
  background: #3d5cbd
}
.black-cta {
  background: #1d1f1f
}
.black-cta:active {
  background: #1a1b1b
}
.green-cta,
input[type="submit"],
.purple-cta,
#vertical-form.purple input[type="submit"],
.navy-cta,
#vertical-form.navy input[type="submit"],
.blue-cta,
#vertical-form.blue input[type="submit"],
.black-cta {
  color: #fff !important
}
.green-cta > svg.arrow-right,
input[type="submit"] > svg.arrow-right,
.purple-cta > svg.arrow-right,
#vertical-form.purple input[type="submit"] > svg.arrow-right,
.navy-cta > svg.arrow-right,
#vertical-form.navy input[type="submit"] > svg.arrow-right,
.blue-cta > svg.arrow-right,
#vertical-form.blue input[type="submit"] > svg.arrow-right,
.black-cta > svg.arrow-right {
  stroke: #fff !important
}
.green-cta:active,
input[type="submit"]:active,
.purple-cta:active,
#vertical-form.purple input[type="submit"]:active,
.navy-cta:active,
#vertical-form.navy input[type="submit"]:active,
.blue-cta:active,
#vertical-form.blue input[type="submit"]:active,
.black-cta:active {
  color: #e5e5e5;
  -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px
}
.green-cta:active > svg.arrow-right,
input[type="submit"]:active > svg.arrow-right,
.purple-cta:active > svg.arrow-right,
#vertical-form.purple input[type="submit"]:active > svg.arrow-right,
.navy-cta:active > svg.arrow-right,
#vertical-form.navy input[type="submit"]:active > svg.arrow-right,
.blue-cta:active > svg.arrow-right,
#vertical-form.blue input[type="submit"]:active > svg.arrow-right,
.black-cta:active > svg.arrow-right {
  stroke: #e5e5e5 !important
}
.white-green-cta,
.white-purple-cta,
.white-navy-cta,
.white-blue-cta,
.white-black-cta {
  background: #fff
}
.white-green-cta:active,
.white-purple-cta:active,
.white-navy-cta:active,
.white-blue-cta:active,
.white-black-cta:active {
  background: #e5e5e5;
  -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px
}
.white-green-cta,
.outlined-green-cta {
  color: #22a0c7
}
.white-green-cta > svg.arrow-right,
.outlined-green-cta > svg.arrow-right {
  stroke: #22a0c7 !important
}
.white-green-cta:active,
.outlined-green-cta:active {
  color: #1e90b3
}
.white-green-cta:active > svg.arrow-right,
.outlined-green-cta:active > svg.arrow-right {
  stroke: #1e90b3 !important
}
.white-purple-cta,
.outlined-purple-cta {
  color: #aa4ea2
}
.white-purple-cta > svg.arrow-right,
.outlined-purple-cta > svg.arrow-right {
  stroke: #aa4ea2 !important
}
.white-purple-cta:active,
.outlined-purple-cta:active {
  color: #994691
}
.white-purple-cta:active > svg.arrow-right,
.outlined-purple-cta:active > svg.arrow-right {
  stroke: white !important
}
.white-navy-cta,
.outlined-navy-cta {
  color: #4573a9
}
.white-navy-cta > svg.arrow-right,
.outlined-navy-cta > svg.arrow-right {
  stroke: #4573a9 !important
}
.white-navy-cta:active,
.outlined-navy-cta:active {
  color: #3e6798
}
.white-navy-cta:active > svg.arrow-right,
.outlined-navy-cta:active > svg.arrow-right {
  stroke: #3e6798 !important
}
.white-blue-cta,
.outlined-blue-cta {
  color: #4467d3
}
.white-blue-cta > svg.arrow-right,
.outlined-blue-cta > svg.arrow-right {
  stroke: #4467d3 !important
}
.white-blue-cta:active,
.outlined-blue-cta:active {
  color: #3d5cbd
}
.white-blue-cta:active > svg.arrow-right,
.outlined-blue-cta:active > svg.arrow-right {
  stroke: #3d5cbd !important
}
.white-black-cta,
.outlined-black-cta {
  color: #1d1f1f
}
.white-black-cta > svg.arrow-right,
.outlined-black-cta > svg.arrow-right {
  stroke: #1d1f1f !important
}
.white-black-cta:active,
.outlined-black-cta:active {
  color: #1a1b1b
}
.white-black-cta:active > svg.arrow-right,
.outlined-black-cta:active > svg.arrow-right {
  stroke: #1a1b1b !important
}
.outlined-green-cta {
  border: 1px solid #22a0c7
}
.outlined-green-cta:hover {
  background-color: #22a0c7;
  color: #fff
}
.outlined-green-cta:hover > svg.arrow-right {
  stroke: #fff !important
}
.outlined-green-cta:active {
  border-color: #1e90b3;
  background-color: #1e90b3;
  color: #e5e5e5
}
.outlined-green-cta:active > svg.arrow-right {
  stroke: #e5e5e5 !important
}
.outlined-purple-cta {
  border: 1px solid #aa4ea2
}
.outlined-purple-cta:hover {
  background-color: #aa4ea2;
  color: #fff
}
.outlined-purple-cta:hover > svg.arrow-right {
  stroke: #fff !important
}
.outlined-purple-cta:active {
  border-color: #994691;
  background-color: #994691;
  color: #e5e5e5
}
.outlined-purple-cta:active > svg.arrow-right {
  stroke: #e5e5e5 !important
}
.outlined-navy-cta {
  border: 1px solid #4573a9
}
.outlined-navy-cta:hover {
  background-color: #4573a9;
  color: #fff
}
.outlined-navy-cta:hover > svg.arrow-right {
  stroke: #fff !important
}
.outlined-navy-cta:active {
  border-color: #3e6798;
  background-color: #3e6798;
  color: #e5e5e5
}
.outlined-navy-cta:active > svg.arrow-right {
  stroke: #e5e5e5 !important
}
.outlined-blue-cta {
  border: 1px solid #4467d3
}
.outlined-blue-cta:hover {
  background-color: #4467d3;
  color: #fff
}
.outlined-blue-cta:hover > svg.arrow-right {
  stroke: #fff !important
}
.outlined-blue-cta:active {
  border-color: #3d5cbd;
  background-color: #3d5cbd;
  color: #e5e5e5
}
.outlined-blue-cta:active > svg.arrow-right {
  stroke: #e5e5e5 !important
}
.outlined-black-cta {
  border: 1px solid #1d1f1f
}
.outlined-black-cta:hover {
  background-color: #1d1f1f;
  color: #fff
}
.outlined-black-cta:hover > svg.arrow-right {
  stroke: #fff !important
}
.outlined-black-cta:active {
  border-color: #1a1b1b;
  background-color: #1a1b1b;
  color: #e5e5e5
}
.outlined-black-cta:active > svg.arrow-right {
  stroke: #e5e5e5 !important
}
textarea {
  resize: vertical
}
img.responsive,
svg.responsive {
  max-width: 100%
}
img.section-center,
svg.section-center {
  display: block;
  margin: auto;
  margin-bottom: 1.55556em
}
.quote {
  font-style: italic
}
.no-wrap {
  white-space: nowrap
}
.one-grid-top {
  padding-top: 1.22222em !important
}
.one-grid-bottom {
  padding-bottom: 1.22222em !important
}
.two-button-cta div br {
  display: inline-block
}
.two-button-cta div br + a {
  margin: 22px auto 0px auto
}
#whitepapers h1 {
  text-align: center;
  color: #4c5050;
  margin-left: 0em
}
#whitepapers h2 {
  font-size: 1.44444em;
  line-height: 2.15385em;
  margin-top: 0em
}
#whitepapers .papers > .paper {
  background-color: #fff;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 28px;
  -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  margin-top: 28px
}
#whitepapers .papers > .paper .pure-u-7-24 > img {
  margin-top: 5px
}
#whitepapers .papers > .paper h2,
#whitepapers .papers > .paper p,
#whitepapers .papers > .paper .social-outer,
#whitepapers .papers > .paper a {
  margin-left: 4%
}
#whitepapers > div > div > .latest-blogs > div {
  margin-left: 10%
}
#whitepapers > div > div > .latest-blogs > div h3 {
  font-size: 0.88889em;
  line-height: 1.75em;
  color: #4c5050;
  font-weight: 700;
  margin-top: 0em
}
#whitepapers > div > div > .latest-blogs > div > div {
  margin-bottom: 28px
}
#whitepapers > div > div > .latest-blogs > div > div > .pure-u-5-24 > img {
  display: block
}
#whitepapers > div > div > .latest-blogs > div > div > .pure-u-17-24 {
  margin-left: 8.33333%;
  min-height: 84px
}
#whitepapers > div > div > .latest-blogs > div > div h4,
#whitepapers > div > div > .latest-blogs > div > div a {
  font-size: 16px;
  line-height: 28px;
  display: block
}
#whitepapers > div > div > .latest-blogs > div > div h4 > svg,
#whitepapers > div > div > .latest-blogs > div > div h4 > img,
#whitepapers > div > div > .latest-blogs > div > div a > svg,
#whitepapers > div > div > .latest-blogs > div > div a > img {
  vertical-align: middle;
  margin: 0px 0px -1px 3px;
  stroke: #22a0c7
}
#whitepapers > div > div > .latest-blogs > div > div h4 {
  font-weight: 400;
  margin: 0em
}
#whitepapers > div > div > .latest-blogs > div + div {
  margin-top: 56px;
  padding: 28px;
  background-color: #4db2d1;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRlYmNiMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkYTlmMyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #4ebcb0, #4da9f3);
  background-image: -webkit-linear-gradient(315deg, #4ebcb0, #4da9f3);
  background-image: linear-gradient(135deg, #4ebcb0, #4da9f3);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px
}
#whitepapers > div > div > .latest-blogs > div + div > div {
  margin-bottom: 0em
}
#whitepapers > div > div > .latest-blogs > div + div p {
  color: #fff;
  rgba: 255, 255, 255, 0.9
}
#whitepapers > div > div > .latest-blogs > div + div a {
  display: inline-block;
  margin: 13px 0px
}
#whitepapers > div > div > .latest-blogs > div + div a > svg,
#whitepapers > div > div > .latest-blogs > div + div a > img {
  margin: 0px 0px 3px 3px
}
#whitepapers > div > div > .latest-blogs > div + div > .pure-u-17-24 {
  margin-left: 8.33333%
}
#whitepapers .latest-blogs,
#whitepapers .latest-papers {
  display: none
}
#blog .byline {
  font-size: 0.77778em;
  line-height: 2em;
  color: #868380;
  margin-bottom: 1.55556em
}
#blog .social-outer {
  color: #888;
  font-size: 12px;
  font-weight: 600;
  position: relative;
  top: -0.3rem
}
#blog .social-outer > div {
  position: relative;
  z-index: 2;
  border: 1px solid #ddd;
  background-color: #f2f2f2;
  display: inline-block;
  height: 34px;
  width: 74px;
  vertical-align: top;
  text-align: center;
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px
}
#blog .social-outer > div p {
  margin: 8px 0px 0px 0px
}
#blog .social-outer > div + div {
  left: -3px;
  border: 0px;
  z-index: 1;
  background-color: transparent;
  width: 190px;
  overflow: hidden;
  height: 36px;
  -moz-border-radius-topleft: 0px;
  -webkit-border-top-left-radius: 0px;
  border-top-left-radius: 0px;
  -moz-border-radius-bottomleft: 0px;
  -webkit-border-bottom-left-radius: 0px;
  border-bottom-left-radius: 0px
}
#blog .social-outer > div + div > div {
  position: relative;
  left: -140px
}
#blog .social-outer > div + div a {
  display: inline-block;
  float: left;
  width: 34px;
  height: 22px;
  background-color: white;
  border: 1px solid #ddd;
  border-left: 0px;
  padding: 6px 0px;
  vertical-align: middle
}
#blog .social-outer > div + div a.blog-google > img {
  margin-top: 4px;
  width: 13.455px
}
#blog .social-outer > div + div a.blog-linkedin > img {
  margin-top: 3px;
  width: 11.606px
}
#blog .social-outer > div + div a.blog-facebook > img {
  margin-top: 4px;
  width: 6.762px
}
#blog .social-outer > div + div a.blog-twitter > img {
  margin-top: 4px;
  width: 13.553px
}
#blog .social-outer > div + div a.blog-google:hover {
  background-color: #dd4b39
}
#blog .social-outer > div + div a.blog-linkedin:hover {
  background-color: #007bb6
}
#blog .social-outer > div + div a.blog-facebook:hover {
  background-color: #3b5999
}
#blog .social-outer > div + div a.blog-twitter:hover {
  background-color: #55acee
}
#blog .social-outer > div + div p {
  line-height: 2.9;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
  margin: 0px;
  float: left;
  padding: 0rem 0.4rem;
  min-width: 20px;
  height: 34px;
  display: inline-block;
  background-color: #f2f2f2;
  border: 1px solid #ddd;
  border-left: 0px
}
#blog .blog-lower-nav {
  margin-left: 29.16667%;
  text-align: center
}
#blog .blog-lower-nav > div {
  display: block;
  width: 100%;
  margin-top: 1.55556em;
  margin-bottom: 1.55556em
}
#blog .blog-lower-nav > div > a {
  display: inline-block;
  width: 20%;
  padding: 9px 0px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  text-align: center;
  vertical-align: middle
}
#blog .blog-lower-nav > div > a.active {
  background-color: #1e89bb;
  color: white
}
#blog .blog-lower-nav > a {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding: 0.5em 0em
}
#login-container {
  overflow-y: scroll;
  overflow-x: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
  z-index: 150
}
#login-form {
  width: 80%;
  max-width: 400px;
  margin: 1em auto;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 8px, rgba(0, 0, 0, 0.24) 0px 8px 8px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 8px, rgba(0, 0, 0, 0.24) 0px 8px 8px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 8px, rgba(0, 0, 0, 0.24) 0px 8px 8px;
  overflow: hidden
}
#login-form p {
  font-size: 0.73em !important;
  margin: 0
}
#login-form .forms {
  background-color: white;
  padding: 28px 8%
}
#login-form .forms form {
  display: none
}
#login-form .forms form.selected {
  display: block
}
#login-form .pure-u-5-5 {
  position: relative
}
#login-form #toggle-login,
#login-form #toggle-signup {
  background-color: #e2e2e2;
  color: #868380;
  text-align: center;
  padding: 14px 0em;
  text-transform: uppercase
}
#login-form #toggle-login:hover,
#login-form #toggle-signup:hover {
  text-decoration: none
}
#login-form #toggle-login.selected,
#login-form #toggle-signup.selected {
  background-color: white;
  color: #1e89bb
}
#login-form input {
  -moz-transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12);
  -o-transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12);
  -webkit-transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12);
  transition: background-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12), border-color 0.6s cubic-bezier(0.155, 1.105, 0.295, 1.12)
}
#login-form input.error {
  background-color: #ffcdd2;
  color: #f44336;
  border: 1px solid #f44336
}
#login-form p.error {
  position: absolute;
  bottom: 0px;
  left: 0px;
  margin: 0px;
  font-size: 14px;
  color: #f44336;
  display: none
}
#login-form label {
  font-size: 0.77778em;
  line-height: 2em;
  text-transform: uppercase
}
#login-form input[type="text"],
#login-form input[type="password"] {
  clear: both
}
#login-form input[type='checkbox'] {
  margin-top: -2px;
  vertical-align: middle
}
#login-form input[type='checkbox'] + label {
  margin-left: 0.4em
}
#login-form .forgot-pass {
  float: right;
  text-align: right;
  font-size: 0.77778em;
  line-height: 2em
}
#login-form .outlined-black-cta {
  border-color: #606363;
  color: #606363
}
#login-form .outlined-black-cta:hover {
  background-color: #606363;
  color: #fff
}
#login-form .outlined-black-cta:active {
  background-color: #565959;
  color: #e5e5e5
}
#login-form input[type="submit"] {
  float: right
}
#login-form p {
  text-align: center;
  font-size: 1em;
  line-height: 1.55556em
}
#login-form #user-register-form > input[type="hidden"] + div {
  width: 0;
  height: 0;
  overflow: hidden
}
#background-overlay {
  background-color: #000;
  top: 0;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 105;
  display: none
}
.bar-legend {
  width: 100%;
  margin: 0em;
  text-align: center;
  padding: 0em;
  list-style: none
}
.bar-legend li {
  font-size: 12px;
  margin-right: 0.2em;
  display: inline-block;
  margin-right: 0.6em
}
.bar-legend li span {
  width: 10px;
  height: 10px;
  display: inline-block;
  margin-right: 0.4em
}
#promo-popup {
  display: none;
  position: fixed;
  width: 200px;
  background-color: white;
  padding: 28px 0px 28px 28px;
  top: 25%;
  right: -250px;
  z-index: 80;
  overflow: hidden;
  text-align: center;
  -moz-box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  -moz-border-radius-topleft: 3px;
  -webkit-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
  -moz-border-radius-bottomleft: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px
}
#promo-popup h4 {
  margin: 28px 0em;
  font-weight: 700;
  font-size: 1.1em
}
#promo-popup > h4,
#promo-popup > p {
  padding: 0em 14px
}
#promo-popup a + div {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  vertical-align: middle;
  background-color: #22a0c7;
  width: 28px;
  cursor: pointer
}
#promo-popup a + div p {
  color: white;
  font-weight: 700;
  position: absolute;
  width: 100%;
  text-align: center;
  top: 50%;
  margin-bottom: 0em;
  margin-top: -10px;
  -moz-transition: -moz-transform 0.3s;
  -o-transition: -o-transform 0.3s;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s
}
#promo-popup a + div p.close {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH"
}
#dataContainer {
  height: 90%
}
.nmt {
  margin-top: 0em !important
}
.nmb {
  margin-bottom: 0em !important
}
@media (min-width: 35.5em) {
  .two-button-cta div br {
    display: none
  }
  .two-button-cta div br + a {
    margin: 0px 0px 0px 22px
  }
  #blog .blog-lower-nav {
    margin-left: 20.83333%;
    text-align: left
  }
  #blog .blog-lower-nav > div {
    margin-top: 0em;
    margin-bottom: 0em;
    display: inline-block;
    width: 34%
  }
  #blog .blog-lower-nav > div + a {
    margin-right: 0%
  }
  #blog .blog-lower-nav > a {
    width: auto;
    margin-left: 4%;
    margin-right: 4%;
    padding: 0.5em 1em
  }
  #promo-popup {
    display: block
  }
}
@media (min-width: 48em) {
  .white-section > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .grey-section > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .grey-gradient-section > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .green-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .purple-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .case-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .navy-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24,
  .blue-gradient > div > div div.pure-u-md-11-24 + div.pure-u-md-11-24 {
    margin-left: 8.33333%
  }
  .white-section > div div.image-right,
  .white-section > div div.wide-image-right,
  .grey-section > div div.image-right,
  .grey-section > div div.wide-image-right,
  .grey-gradient-section > div div.image-right,
  .grey-gradient-section > div div.wide-image-right,
  .green-gradient > div div.image-right,
  .green-gradient > div div.wide-image-right,
  .purple-gradient > div div.image-right,
  .purple-gradient > div div.wide-image-right,
  .case-gradient > div div.image-right,
  .case-gradient > div div.wide-image-right,
  .navy-gradient > div div.image-right,
  .navy-gradient > div div.wide-image-right,
  .blue-gradient > div div.image-right,
  .blue-gradient > div div.wide-image-right {
    margin-left: 8.33333%
  }
  .white-section > div div.image-left,
  .white-section > div div.wide-image-left,
  .grey-section > div div.image-left,
  .grey-section > div div.wide-image-left,
  .grey-gradient-section > div div.image-left,
  .grey-gradient-section > div div.wide-image-left,
  .green-gradient > div div.image-left,
  .green-gradient > div div.wide-image-left,
  .purple-gradient > div div.image-left,
  .purple-gradient > div div.wide-image-left,
  .case-gradient > div div.image-left,
  .case-gradient > div div.wide-image-left,
  .navy-gradient > div div.image-left,
  .navy-gradient > div div.wide-image-left,
  .blue-gradient > div div.image-left,
  .blue-gradient > div div.wide-image-left {
    margin-right: 8.33333%
  }
  .white-section > div div.wide-image-right,
  .white-section > div div.wide-image-left,
  .grey-section > div div.wide-image-right,
  .grey-section > div div.wide-image-left,
  .grey-gradient-section > div div.wide-image-right,
  .grey-gradient-section > div div.wide-image-left,
  .green-gradient > div div.wide-image-right,
  .green-gradient > div div.wide-image-left,
  .purple-gradient > div div.wide-image-right,
  .purple-gradient > div div.wide-image-left,
  .case-gradient > div div.wide-image-right,
  .case-gradient > div div.wide-image-left,
  .navy-gradient > div div.wide-image-right,
  .navy-gradient > div div.wide-image-left,
  .blue-gradient > div div.wide-image-right,
  .blue-gradient > div div.wide-image-left {
    margin-top: 1.2em;
    margin-bottom: 0em
  }
  .white-section > div div.wide-image-right > div,
  .white-section > div div.wide-image-left > div,
  .grey-section > div div.wide-image-right > div,
  .grey-section > div div.wide-image-left > div,
  .grey-gradient-section > div div.wide-image-right > div,
  .grey-gradient-section > div div.wide-image-left > div,
  .green-gradient > div div.wide-image-right > div,
  .green-gradient > div div.wide-image-left > div,
  .purple-gradient > div div.wide-image-right > div,
  .purple-gradient > div div.wide-image-left > div,
  .case-gradient > div div.wide-image-right > div,
  .case-gradient > div div.wide-image-left > div,
  .navy-gradient > div div.wide-image-right > div,
  .navy-gradient > div div.wide-image-left > div,
  .blue-gradient > div div.wide-image-right > div,
  .blue-gradient > div div.wide-image-left > div {
    -moz-border-radius: 27px;
    -webkit-border-radius: 27px;
    border-radius: 27px;
    width: 620px
  }
  .white-section > div div.wide-image-left > div,
  .grey-section > div div.wide-image-left > div,
  .grey-gradient-section > div div.wide-image-left > div,
  .green-gradient > div div.wide-image-left > div,
  .purple-gradient > div div.wide-image-left > div,
  .case-gradient > div div.wide-image-left > div,
  .navy-gradient > div div.wide-image-left > div,
  .blue-gradient > div div.wide-image-left > div {
    float: right
  }
  #footer > div > .afilias-links div + div,
  #footer > div > .copyright div + div {
    margin-left: 4.16667% !important
  }
  #vertical-form > div > form {
    margin-left: 8.33333%
  }
  #vertical-form > div > form div.second {
    margin-left: 8.33333%
  }
  #vertical-form .form-error {
    width: 94%;
    padding: 3%;
    padding-top: 1.55556em;
    padding-bottom: 1.55556em
  }
  #blog .blog-lower-nav > div {
    width: 48%
  }
  .image-spacing {
    margin-top: 56px
  }
}
@media (min-width: 960px) {
  .white-section > div.first,
  .grey-section > div.first,
  .grey-gradient-section > div.first,
  .green-gradient > div.first,
  .purple-gradient > div.first,
  .case-gradient > div.first,
  .navy-gradient > div.first,
  .blue-gradient > div.first {
    padding-top: 7.77778em
  }
  .white-section > div.pricingpage,
  .grey-section > div.pricingpage,
  .grey-gradient-section > div.pricingpage,
  .green-gradient > div.pricingpage,
  .purple-gradient > div.pricingpage,
  .case-gradient > div.pricingpage,
  .navy-gradient > div.pricingpage,
  .blue-gradient > div.pricingpage {
    padding-top: 6.22222em
  }
  #app .pat-block,
  #opp .pat-block {
    width: 45%;
    margin-bottom: 0em;
    margin: auto
  }
  #app .pat-block + .pat-block,
  #opp .pat-block + .pat-block {
    margin-left: 4%
  }
  #web .pat-block {
    width: 22.5%;
    margin-bottom: 0em;
    margin: auto
  }
  #web .pat-block + .pat-block {
    margin-left: 3.33333%
  }
  #whitepapers h1 {
    text-align: left
  }
  #whitepapers .papers {
    width: 62.5%
  }
  #whitepapers .latest-blogs {
    width: 37.5%;
    display: inline-block
  }
  #form-scroll-marker,
  .scroll-marker {
    top: -84px
  }
}
@media (min-width: 64em) {
  #footer > div > .afilias-links div + div {
    margin-left: 6.94444% !important
  }
  #blog .blog-lower-nav > div {
    width: 39%
  }
}
@media (min-width: 80em) {
  #blog .blog-lower-nav > div {
    width: 47%
  }
  .white-section > div div.wide-image-right > div,
  .white-section > div div.wide-image-right img,
  .white-section > div div.wide-image-left > div,
  .white-section > div div.wide-image-left img,
  .grey-section > div div.wide-image-right > div,
  .grey-section > div div.wide-image-right img,
  .grey-section > div div.wide-image-left > div,
  .grey-section > div div.wide-image-left img {
    width: 100%
  }
  .white-section > div div.wide-image-right > div,
  .white-section > div div.wide-image-left > div,
  .grey-section > div div.wide-image-right > div,
  .grey-section > div div.wide-image-left > div {
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px
  }
}
.thumbnail {
  -moz-box-shadow: 0px 0px 5px #616464;
  -webkit-box-shadow: 0px 0px 5px #616464;
  box-shadow: 0px 0px 5px #616464;
  width: 178px;
  cursor: pointer;
  height: 100px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  overflow: hidden;
  margin: auto 0;
  position: relative
}
@media screen and (max-width: 48em) {
  .thumbnail {
    margin: auto
  }
}
.thumbnail:hover .bg {
  -moz-transform: scale(1.2, 1.2);
  -ms-transform: scale(1.2, 1.2);
  -webkit-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2)
}
.thumbnail:hover .overlay {
  opacity: 0
}
.thumbnail .bg {
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  z-index: 0;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease
}
.thumbnail svg {
  opacity: .8;
  width: 74px;
  height: 74px;
  position: absolute;
  z-index: 2;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto
}
.thumbnail svg .cls-1 {
  fill: #616464
}
.thumbnail svg .cls-2 {
  fill: none;
  stroke: #616464;
  stroke-miterlimit: 10;
  stroke-width: 4px
}
.thumbnail .overlay {
  width: 100%;
  height: 100%;
  opacity: .4;
  background-color: white;
  z-index: 1;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease
}
.contact-select {
  width: 100%;
  height: 56px
}
.check-box-error {
  animation: animationFrames linear 1s 3;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames linear 1s 3;
  -webkit-animation-iteration-count: 1 3;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animationFrames linear 1s 3;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: animationFrames linear 1s 3;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: animationFrames linear 1s 3;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%
}
@keyframes animationFrames {
  0% {
    transform: rotate(0deg) scale(1)
  }
  10% {
    transform: rotate(-10deg) scale(1)
  }
  20% {
    transform: rotate(-10deg) scale(1)
  }
  30% {
    transform: rotate(3deg) scale(1)
  }
  40% {
    transform: rotate(-10deg) scale(1)
  }
  50% {
    transform: rotate(3deg) scale(1)
  }
  60% {
    transform: rotate(-10deg) scale(1)
  }
  70% {
    transform: rotate(3deg) scale(1)
  }
  80% {
    transform: rotate(-10deg) scale(1)
  }
  90% {
    transform: rotate(3deg) scale(1)
  }
  100% {
    transform: rotate(0deg) scale(1)
  }
}
@-moz-keyframes animationFrames {
  0% {
    -moz-transform: rotate(0deg) scale(1)
  }
  10% {
    -moz-transform: rotate(-10deg) scale(1)
  }
  20% {
    -moz-transform: rotate(-10deg) scale(1)
  }
  30% {
    -moz-transform: rotate(3deg) scale(1)
  }
  40% {
    -moz-transform: rotate(-10deg) scale(1)
  }
  50% {
    -moz-transform: rotate(3deg) scale(1)
  }
  60% {
    -moz-transform: rotate(-10deg) scale(1)
  }
  70% {
    -moz-transform: rotate(3deg) scale(1)
  }
  80% {
    -moz-transform: rotate(-10deg) scale(1)
  }
  90% {
    -moz-transform: rotate(3deg) scale(1)
  }
  100% {
    -moz-transform: rotate(0deg) scale(1)
  }
}
@-webkit-keyframes animationFrames {
  0% {
    -webkit-transform: rotate(0deg) scale(1)
  }
  10% {
    -webkit-transform: rotate(-10deg) scale(1)
  }
  20% {
    -webkit-transform: rotate(-10deg) scale(1)
  }
  30% {
    -webkit-transform: rotate(3deg) scale(1)
  }
  40% {
    -webkit-transform: rotate(-10deg) scale(1)
  }
  50% {
    -webkit-transform: rotate(3deg) scale(1)
  }
  60% {
    -webkit-transform: rotate(-10deg) scale(1)
  }
  70% {
    -webkit-transform: rotate(3deg) scale(1)
  }
  80% {
    -webkit-transform: rotate(-10deg) scale(1)
  }
  90% {
    -webkit-transform: rotate(3deg) scale(1)
  }
  100% {
    -webkit-transform: rotate(0deg) scale(1)
  }
}
@-o-keyframes animationFrames {
  0% {
    -o-transform: rotate(0deg) scale(1)
  }
  10% {
    -o-transform: rotate(-10deg) scale(1)
  }
  20% {
    -o-transform: rotate(-10deg) scale(1)
  }
  30% {
    -o-transform: rotate(3deg) scale(1)
  }
  40% {
    -o-transform: rotate(-10deg) scale(1)
  }
  50% {
    -o-transform: rotate(3deg) scale(1)
  }
  60% {
    -o-transform: rotate(-10deg) scale(1)
  }
  70% {
    -o-transform: rotate(3deg) scale(1)
  }
  80% {
    -o-transform: rotate(-10deg) scale(1)
  }
  90% {
    -o-transform: rotate(3deg) scale(1)
  }
  100% {
    -o-transform: rotate(0deg) scale(1)
  }
}
@-ms-keyframes animationFrames {
  0% {
    -ms-transform: rotate(0deg) scale(1)
  }
  10% {
    -ms-transform: rotate(-10deg) scale(1)
  }
  20% {
    -ms-transform: rotate(-10deg) scale(1)
  }
  30% {
    -ms-transform: rotate(3deg) scale(1)
  }
  40% {
    -ms-transform: rotate(-10deg) scale(1)
  }
  50% {
    -ms-transform: rotate(3deg) scale(1)
  }
  60% {
    -ms-transform: rotate(-10deg) scale(1)
  }
  70% {
    -ms-transform: rotate(3deg) scale(1)
  }
  80% {
    -ms-transform: rotate(-10deg) scale(1)
  }
  90% {
    -ms-transform: rotate(3deg) scale(1)
  }
  100% {
    -ms-transform: rotate(0deg) scale(1)
  }
}
.agreement-checkbox {
  transform: scale(1)
}
.product-cards-link {
  color: #616464;
  text-transform: uppercase;
  font-weight: 600
}
#bottom-search {
  font-size: 12px;
  line-height: 12px;
  height: 10px;
  width: 0px;
  margin-top: -3%
}
.search-top {
  opacity: 0;
  padding: 0;
  margin: 0;
  height: 20px;
  width: 0px
}
#ua-tester {
  overflow: visible
}
#ua-tester #result {
  padding-left: 1em
}
#ua-tester #result table,
#ua-tester #result h3 {
  margin-left: 1em
}
@media screen and (max-width: 960px) {
  #ua-tester #result table,
  #ua-tester #result p,
  #ua-tester #result h3 {
    margin-top: 4.5em;
    margin-left: 0em
  }
  #ua-tester #result table {
    font-size: 14px
  }
}
#ua-tester pre {
  margin: 0px
}
#ua-tester p {
  margin: 8px 0px 0px 0px
}
#ua-tester p:first-of-type {
  margin-top: 3em;
  width: 100%
}
@media screen and (max-width: 960px) {
  #ua-tester p:first-of-type {
    margin-top: 8px
  }
}
@media screen and (max-width: 960px) {
  #ua-tester .test-uas {
    margin-top: 2em
  }
  #ua-tester .test-uas pre {
    max-width: 90%
  }
  #ua-tester .test-uas pre:last-of-type {
    margin-bottom: 2em
  }
}
.dropbtn {
  padding: 0 0 0 0px;
  font-size: 16px;
  border: none;
  color: #606363
}
.dropbtn:hover {
  color: #23ac9d;
  text-decoration: none
}
.dropbtn:hover svg,
.dropbtn:hover img {
  fill: #23ac9d
}
.super-nav {
  z-index: 10000 !important;
  margin: 0 auto;
  height: 40px;
  border-bottom: 1px solid #f5f5f5;
  background-color: white
}
@media screen and (max-width: 960px) {
  .super-nav {
    display: none
  }
}
.super-nav .pure-menu {
  height: 30px !important;
  width: 100%;
  padding-left: 10%;
  padding-right: 10.5%
}
@media screen and (min-width: 960px) and (max-width: 1200px) {
  .super-nav .pure-menu {
    padding-left: 10%;
    padding-right: 6%
  }
}
.super-nav .pure-menu .pure-menu-list:nth-of-type(1) {
  width: 50%;
  text-align: left
}
.super-nav .pure-menu .pure-menu-list:nth-of-type(2) {
  width: 50%;
  text-align: right
}
.super-nav a {
  position: relative;
  font-size: 12px;
  font-weight: 400;
  color: #0d7da9;
  text-align: center
}
.super-nav a:hover {
  text-decoration: none;
  color: #085b7b;
  background-color: transparent
}
.super-nav a.active {
  fill: #0e506a !important;
  color: #0e506a !important;
  stroke: #0e506a !important
}
.super-nav .search-top {
  margin-top: 1% !important
}
.navbar {
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 100;
  height: 80px;
  padding: 0;
  margin-bottom: 2em;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px 0px, rgba(0, 0, 0, 0.23) 0px 3px 6px 0px
}
.navbar .pure-menu-item {
  cursor: pointer
}
.navbar:not(#inverted) {
  background-color: white;
  position: fixed
}
.navbar:not(#inverted) #main-nav {
  background-color: white;
  -moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
}
.navbar:not(#inverted) .regular-logo {
  display: inline-block
}
.navbar:not(#inverted) .inverted-logo {
  display: none
}
@media screen and (max-width: 960px) {
  .navbar svg {
    margin-top: 1.2em;
    margin-left: 1.2em
  }
  .navbar svg path {
    fill: #000
  }
}
#main-nav {
  padding-right: 10%;
  padding-left: 10%;
  height: 100%;
  margin-bottom: 5%;
  width: 100%
}
@media screen and (max-width: 960px) {
  #main-nav {
    margin-left: 0em
  }
  #main-nav .logo {
    vertical-align: middle;
    width: 200px;
    margin-left: 0 !important;
    margin-top: 20px !important
  }
  #main-nav .menu-icon,
  #main-nav #mobile-menu {
    display: inline-block
  }
}
@media screen and (min-width: 960px) and (max-width: 1200px) {
  #main-nav {
    padding-left: 10%;
    padding-right: 2.5%
  }
}
#main-nav .logo {
  margin-top: 20px
}
@media screen and (max-width: 1060px) {
  #main-nav .nav-items-container a.pure-menu-link {
    padding-left: 0.25em;
    padding-right: 0.25em
  }
}
.nav-container {
  top: 0;
  bottom: 0;
  right: 0;
  position: relative;
  display: inline-block;
  float: right;
  height: 50px
}
@media screen and (max-width: 960px) {
  .nav-container {
    display: none
  }
}
.nav-items-container a {
  font-weight: 500;
  height: 100%;
  font-size: 16px;
  color: #1f94c1
}
.nav-items-container a.pure-menu-link {
  padding-top: 20px;
  padding-bottom: 30px
}
.nav-items-container a.active {
  fill: #0e506a !important;
  color: #0e506a !important;
  stroke: #0e506a !important
}
.nav-items-container a .fas {
  font-size: 10px
}
.nav-items-container a:hover.pure-menu-link {
  z-index: -10;
  color: #0e506a;
  text-decoration: none;
  background-color: transparent
}
.nav-items-container a:hover .fas {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg)
}
.drop-container {
  cursor: pointer;
  z-index: 100
}
.drop-container:hover .dropdown,
.drop-container:focus .dropdown {
  z-index: 1993;
  display: block;
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  -moz-transition: all 0.5s cubic-bezier(0.155, 1.105, 0.295, 1.12), opacity 0.2s linear;
  -o-transition: all 0.5s cubic-bezier(0.155, 1.105, 0.295, 1.12), opacity 0.2s linear;
  -webkit-transition: all 0.5s cubic-bezier(0.155, 1.105, 0.295, 1.12), opacity 0.2s linear;
  transition: all 0.5s cubic-bezier(0.155, 1.105, 0.295, 1.12), opacity 0.2s linear
}
.drop-container:hover .dropdown.resources-drop-container,
.drop-container:focus .dropdown.resources-drop-container {
  right: 10px !important
}
@media screen and (max-width: 1200px) {
  .drop-container:hover .dropdown.resources-drop-container,
  .drop-container:focus .dropdown.resources-drop-container {
    right: -30% !important
  }
  .drop-container:hover .dropdown.resources-drop-container:after,
  .drop-container:focus .dropdown.resources-drop-container:after {
    left: 185px
  }
}
.dropdown {
  z-index: 200;
  height: 400%;
  width: 300px;
  background-color: #fff;
  position: absolute;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 5px, rgba(0, 0, 0, 0.2) 0px 0px 1px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 5px, rgba(0, 0, 0, 0.2) 0px 0px 1px;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 5px, rgba(0, 0, 0, 0.2) 0px 0px 1px;
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transform-origin: 37px -8px;
  -ms-transform-origin: 37px -8px;
  -webkit-transform-origin: 37px -8px;
  transform-origin: 37px -8px;
  margin-top: -1em
}
.dropdown.has-featurecard {
  width: 700px
}
@media screen and (max-width: 1200px) {
  .dropdown.has-featurecard {
    left: -150%
  }
  .dropdown.has-featurecard:after {
    left: 145px
  }
}
.dropdown:after {
  background: url(/sites/deviceatlas.com/themes/brewdock/images/static-pages/icons/dropdown-arrow.png) center center no-repeat;
  background-size: 15px;
  width: 15px;
  height: 8px;
  position: absolute;
  top: -8px;
  content: ''
}
.dropdown:after {
  left: 30px
}
.dropdown.resources-drop-container:after {
  left: 243px
}
.dropdown .device-data-first-link {
  padding-top: 15% !important;
  margin-bottom: 5%
}
html[data-browser*="Mozilla"] .dropdown .device-data-first-link {
  padding-top: 6% !important
}
.dropdown .link-cards {
  height: 100%
}
.dropdown .link-cards.products-drop li {
  height: 25% !important
}
.dropdown .link-cards.products-drop li:nth-of-type(2) span,
.dropdown .link-cards.products-drop li:nth-of-type(3) span,
.dropdown .link-cards.products-drop li:nth-of-type(4) span {
  padding-top: 1%
}
.dropdown .link-cards.products-drop li img {
  margin-top: -2.5%
}
@-moz-document url-prefix() {
  .dropdown .link-cards.products-drop .first-product-card {
    padding-top: 7% !important
  }
  .dropdown .link-cards.products-drop li div {
    padding-top: 2% !important
  }
}
.dropdown .link-cards.resources-drop li {
  height: 25% !important
}
.dropdown .link-cards.resources-drop p {
  margin-top: 10px
}
.dropdown .link-cards.resources-drop span {
  line-height: 16px
}
@-moz-document url-prefix() {
  .dropdown .link-cards.resources-drop .first-product-card {
    padding-top: 7% !important
  }
}
.dropdown .link-cards.device-data-dropdown {
  display: flex;
  align-items: center
}
.dropdown .link-cards.device-data-dropdown li {
  height: 25%
}
.dropdown .link-cards.device-data-dropdown p {
  margin-bottom: 8%;
  margin-top: 8%
}
.dropdown .link-cards ul {
  height: 100%;
  width: 100%;
  padding: 0
}
.dropdown .link-cards li {
  list-style: none;
  height: 34%;
  width: 100%;
  padding-left: -5%
}
.dropdown .link-cards li div {
  height: 80%;
  width: 100%;
  padding: 3%;
  display: flex;
  align-items: center;
  position: relative
}
.dropdown .link-cards li div:not(.has-featurecard) {
  padding-left: 6%;
  width: 91%;
  padding-bottom: 1%
}
@-moz-document url-prefix() {
  .dropdown .link-cards li div:not(.has-featurecard) {
    padding-top: 8%
  }
}
.dropdown .link-cards li div:hover {
  background-color: rgba(32, 145, 193, 0.05)
}
.dropdown .link-cards li div span {
  line-height: 0px;
  padding-top: 5%
}
.dropdown .link-cards li div span a {
  font-size: 16px;
  margin-bottom: 3%
}
.dropdown .link-cards li div span p {
  padding-right: 2%;
  font-size: 13px;
  margin-top: 25px;
  margin-bottom: 10%
}
@-moz-document url-prefix() {
  .dropdown .link-cards li div span {
    padding-top: 0 !important
  }
}
.dropdown .link-cards li div img {
  margin-left: 2%;
  height: 50%;
  width: 14%;
  margin-right: 6%;
  margin-top: -1.5%
}
.dropdown .link-cards li div img.overview-icon {
  height: 70%
}
.dropdown .dropdown-featurecard {
  height: 100%;
  color: #fff;
  background-color: #0a6c92;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzBkN2RhOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzA4NWI3YiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #0d7da9, #085b7b);
  background-image: -webkit-linear-gradient(315deg, #0d7da9, #085b7b);
  background-image: linear-gradient(135deg, #0d7da9, #085b7b)
}
.dropdown .dropdown-featurecard p:first-of-type {
  color: rgba(255, 255, 255, 0.8);
  font-size: 12px;
  font-kerning: 2px;
  margin-bottom: 1%;
  margin-top: 5%
}
.dropdown .dropdown-featurecard p {
  font-size: 14px;
  color: white
}
.dropdown .dropdown-featurecard p:nth-of-type(2) {
  margin-top: -5%;
  margin-bottom: 0
}
.dropdown .dropdown-featurecard p:last-of-type {
  margin-top: -2%
}
.dropdown .dropdown-featurecard h4 {
  font-size: 20px;
  margin-top: 2%;
  font-weight: 800 !important
}
.dropdown .dropdown-featurecard p,
.dropdown .dropdown-featurecard h4,
.dropdown .dropdown-featurecard .thumb-wrapper {
  margin-left: 15%
}
.dropdown .dropdown-featurecard p.thumb-wrapper,
.dropdown .dropdown-featurecard h4.thumb-wrapper,
.dropdown .dropdown-featurecard .thumb-wrapper.thumb-wrapper {
  margin-top: -2%
}
.dropdown .dropdown-featurecard .thumbnail {
  width: 150px;
  height: 100px
}
.dropdown .dropdown-featurecard .thumbnail svg {
  width: 70px;
  height: 70px
}
.inverted-logo {
  display: none
}
#inverted {
  box-shadow: transparent 0px 3px 6px 0px, transparent 0px 3px 6px 0px !important;
  z-index: 100
}
#inverted.scrollNav-Off .super-nav {
  width: 200%;
  border-bottom: 0
}
#inverted.scrollNav-Off .super-nav .pure-menu-link {
  color: rgba(255, 255, 255, 0.8) !important
}
#inverted.scrollNav-Off .super-nav .pure-menu-link:hover {
  color: white !important
}
#inverted.scrollNav-Off .menu-icon path {
  fill: #fff !important
}
#inverted nav {
  background-color: transparent;
  background: transparent
}
#inverted .nav-items-container .pure-menu-link {
  color: rgba(255, 255, 255, 0.75)
}
#inverted .nav-items-container .pure-menu-link:hover {
  background: transparent;
  color: white
}
@media screen and (min-width: 960px) and (max-width: 1200px) {
  #inverted .nav-items-container .pure-menu-link {
    padding-left: .7em;
    padding-right: .7em
  }
}
#inverted .avatar {
  stroke: rgba(255, 255, 255, 0.75);
  fill: rgba(255, 255, 255, 0.75);
  color: rgba(255, 255, 255, 0.75)
}
#inverted .avatar:hover {
  stroke: white;
  fill: white;
  color: white
}
.scrollNav-On {
  background-color: #fff;
  position: fixed;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px 0px, rgba(0, 0, 0, 0.23) 0px 3px 6px 0px !important
}
.scrollNav-On .regular-logo {
  display: inline-block
}
.scrollNav-On .inverted-logo {
  display: none
}
.scrollNav-On .super-nav {
  border-bottom: 1px solid #f1f1f1
}
.scrollNav-On #main-nav {
  background-color: white;
  -moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
}
.scrollNav-On #main-nav .nav-items-container a {
  font-weight: 500;
  height: 100%;
  font-size: 16px;
  color: #1f94c1
}
.scrollNav-On #main-nav .nav-items-container a.pure-menu-link {
  padding-top: 20px;
  padding-bottom: 30px
}
.scrollNav-On #main-nav .nav-items-container a.active {
  fill: #0e506a !important;
  color: #0e506a !important;
  stroke: #0e506a !important
}
.scrollNav-On #main-nav .nav-items-container a .fas {
  font-size: 10px
}
.scrollNav-On #main-nav .nav-items-container a:hover.pure-menu-link {
  z-index: -10;
  color: #0e506a;
  text-decoration: none;
  background-color: transparent
}
.scrollNav-On #main-nav .nav-items-container a:hover .fas {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg)
}
.scrollNav-Off {
  box-shadow: transparent 0px 3px 6px 0px, transparent 0px 3px 6px 0px !important;
  position: absolute !important
}
.scrollNav-Off .regular-logo {
  display: none
}
.scrollNav-Off .inverted-logo {
  display: inline-block
}

.toolbar .navbar.pure-g.pushed-by-toolbar.scrollNav-Off {
  background-color: #063758;
}

.nav-whole-card-link {
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0%
}
.login-drop-container {
  margin-top: -4% !important;
  width: 150px !important;
  margin-left: -10% !important;
  text-align: left;
  padding: 5% 10%;
  z-index: 5000 !important;
  height: 80px
}
.login-drop-container ul {
  margin-top: 5%;
  list-style-type: none;
  padding-left: 10%
}
.login-drop-link .pure-menu-link svg {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: -95%;
  right: 0;
  margin: auto;
  text-align: center
}
.login-drop-link .pure-menu-link {
  position: relative
}
.transparent-nav {
  background-color: transparent !important;
  position: absolute !important
}
.transparent-nav #main-nav {
  background-color: transparent !important;
  box-shadow: none !important;
  max-width: 1100px;
  margin: 0 auto
}
.transparent-nav .regular-logo {
  display: none !important
}
.transparent-nav .inverted-logo {
  display: inline-block !important
}
.transparent-nav .menu-icon {
  display: none !important
}
#home-customers > .pure-g > div {
  position: relative
}
.darker {
  height: 60px;
  color: #7f7f7f !important;
  font-size: 20px !important
}
@media screen and (max-width: 64em) {
  .darker {
    font-size: 20px !important
  }
}
@media screen and (max-width: 53em) {
  .darker {
    font-size: 16px !important;
    height: 50px
  }
}
@media screen and (max-width: 48em) {
  .darker {
    font-size: 14px !important
  }
}
@media screen and (max-width: 35.5em) {
  .darker {
    height: auto
  }
}
.submenu {
  list-style-type: none;
  margin-left: 1.1%;
  padding: 0;
  width: 100%;
  margin-bottom: 66px
}
@media screen and (max-width: 35.5em) {
  .submenu {
    display: none
  }
}
.submenu hr {
  background-color: #95989a;
  margin-top: 3px;
  height: 1px;
  border: none;
  opacity: .1;
  width: 58%
}
@media screen and (max-width: 48em) {
  .submenu hr {
    width: 100%
  }
}
.submenu li {
  display: inline-block;
  margin-left: 28px;
  margin-right: 28px;
  font-size: 23px
}
.submenu li.active i::before {
  width: 100%
}
.submenu li.appunder i::before {
  background-color: #ab4ea3 !important
}
.submenu li.oppunder i::before {
  background-color: #4573a9 !important
}
.submenu li.faqunder i::before {
  background-color: #454b52 !important
}
@media screen and (max-width: 48em) {
  .submenu li {
    margin-left: 14px;
    margin-right: 14px
  }
}
.submenu li i {
  cursor: pointer;
  margin: auto;
  position: relative;
  text-decoration: none;
  color: #646464;
  font-style: normal !important;
  font-size: 23px;
  -moz-transition: color 0.3s ease;
  -o-transition: color 0.3s ease;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease
}
@media screen and (max-width: 68em) {
  .submenu li i {
    font-size: 20px
  }
}
.submenu li i::before {
  content: '';
  pointer-events: none;
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  width: 0%;
  height: 3px;
  background-color: #22a0c7;
  top: 31px;
  -moz-transition: width 0.3s ease;
  -o-transition: width 0.3s ease;
  -webkit-transition: width 0.3s ease;
  transition: width 0.3s ease
}
@media screen and (max-width: 68em) {
  .submenu li i::before {
    top: 28px
  }
}
.submenu li i:hover::before {
  width: 100%
}
@media screen and (min-width: 35.5em) {
  .submenu-mobile {
    display: none
  }
}
.submenu-mobile select {
  width: 100%;
  margin-bottom: 1em
}
.subcategories .price {
  background-color: #f2f2f2;
  color: #817e7b;
  padding: 14px 10%;
  position: relative
}
.subcategories .price p {
  margin-top: 0
}
.subcategories .price div {
  height: 56px
}
.subcategories .price div .monthly .cur,
.subcategories .price div .monthly .fig,
.subcategories .price div .yearly .cur,
.subcategories .price div .yearly .fig {
  font-size: 2.66667em;
  line-height: 1.16667em
}
.subcategories .price div .monthly .cur,
.subcategories .price div .yearly .cur {
  color: #9a9895
}
.subcategories .price div .monthly .fig,
.subcategories .price div .yearly .fig {
  font-weight: 500;
  color: #606363
}
.subcategories .price .yearly {
  display: none
}
.subcategories .price .saving {
  color: #868380;
  font-size: 0.66667em;
  line-height: 2.33333em
}
.subcategories .price .saving span {
  color: #5e5a56;
  font-weight: 700
}
.subcategories .green-cta,
.subcategories input[type="submit"],
.subcategories .blue-cta,
.subcategories #vertical-form.blue input[type="submit"],
#vertical-form.blue .subcategories input[type="submit"],
.subcategories .purple-cta,
.subcategories #vertical-form.purple input[type="submit"],
#vertical-form.purple .subcategories input[type="submit"],
.subcategories .navy-cta,
.subcategories #vertical-form.navy input[type="submit"],
#vertical-form.navy .subcategories input[type="submit"],
.subcategories .black-cta {
  border-radius: 4px !important;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
.subcategories .navy-cta,
.subcategories #vertical-form.navy input[type="submit"],
#vertical-form.navy .subcategories input[type="submit"] {
  background-color: #22a0c7 !important
}
.subcategories .navy-cta:hover,
.subcategories #vertical-form.navy input[type="submit"]:hover,
#vertical-form.navy .subcategories input[type="submit"]:hover {
  background-color: #197794 !important
}
.subcategories .green-cta,
.subcategories input[type="submit"] {
  background-color: #21a0c7 !important
}
.subcategories .green-cta:hover,
.subcategories input[type="submit"]:hover {
  background-color: #197794 !important
}
.subcategories .purple-cta,
.subcategories #vertical-form.purple input[type="submit"],
#vertical-form.purple .subcategories input[type="submit"] {
  background-color: #ab4ea3 !important
}
.subcategories .purple-cta a,
.subcategories #vertical-form.purple input[type="submit"] a,
#vertical-form.purple .subcategories input[type="submit"] a {
  color: #ab4ea3 !important
}
.subcategories .purple-cta:hover,
.subcategories #vertical-form.purple input[type="submit"]:hover,
#vertical-form.purple .subcategories input[type="submit"]:hover {
  background-color: #783772 !important
}
.subcategories .blue-cta,
.subcategories #vertical-form.blue input[type="submit"],
#vertical-form.blue .subcategories input[type="submit"] {
  background-color: #4573a9 !important
}
.subcategories .blue-cta:hover,
.subcategories #vertical-form.blue input[type="submit"]:hover,
#vertical-form.blue .subcategories input[type="submit"]:hover {
  background-color: #305076 !important
}
.subcategories .black-cta {
  background-color: #454b52 !important
}
.subcategories .black-cta:hover {
  background-color: #1d1f1f !important
}
.subcategories .outlined-green-cta,
.subcategories .outlined-blue-cta,
.subcategories .outlined-purple-cta,
.subcategories .outlined-navy-cta,
.subcategories .outlined-black-cta {
  border-radius: 4px !important;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
.subcategories .outlined-blue-cta {
  border-color: #4573a9 !important;
  color: #4573a9 !important
}
.subcategories .outlined-blue-cta:hover {
  background-color: #4573a9 !important;
  color: white !important
}
.subcategories .outlined-navy-cta {
  border-color: #22a0c7 !important;
  color: #22a0c7 !important
}
.subcategories .outlined-navy-cta:hover {
  background-color: #22a0c7 !important;
  color: white !important
}
.subcategories .outlined-black-cta {
  border-color: #454b52 !important;
  color: #454b52 !important
}
.subcategories .outlined-black-cta:hover {
  background-color: #454b52 !important;
  color: white !important
}
.subcategories #web .price {
  height: 144px
}
.subcategories #web .price.local a {
  margin-top: 36px
}
.subcategories #app .price {
  height: 84px
}
.subcategories #opp .price {
  height: 84px
}
.subcategories #faq {
  min-height: 66vh
}
.subcategories #faq .pure-g {
  margin-top: -20px !important
}
.subcategories #faq .pure-g h2 {
  margin: auto
}
.subcategories #faq .pure-g h3 {
  cursor: pointer;
  position: relative;
  float: left
}
.subcategories #faq .pure-g p {
  clear: left
}
.subcategories #faq .pure-g .plus-wrapper {
  position: relative;
  float: right;
  margin-right: 24px
}
.subcategories #faq .pure-g .plus-sign {
  position: absolute;
  clear: left;
  width: 10px;
  height: 1px;
  top: 14px;
  margin-left: 10px;
  border-radius: 5px;
  background-color: #646464;
  -moz-transition: -moz-transform 0.5s ease;
  -o-transition: -o-transform 0.5s ease;
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease
}
.subcategories #faq .pure-g .plus-sign::before {
  -moz-transition: -moz-transform 0.5s ease;
  -o-transition: -o-transform 0.5s ease;
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  content: '';
  width: 10px;
  height: 1px;
  border-radius: 5px;
  position: absolute;
  background-color: #646464
}
.subcategories #faq .pure-g .plus-sign.active::before {
  -moz-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg)
}
.subcategories #faq p {
  display: none
}
input:-moz-placeholder {
  color: #aeaeae
}
input::-moz-placeholder {
  color: #aeaeae
}
input:-ms-input-placeholder {
  color: #aeaeae
}
input::-webkit-input-placeholder {
  color: #aeaeae
}
textarea:-moz-placeholder {
  color: #aeaeae
}
textarea::-moz-placeholder {
  color: #aeaeae
}
textarea:-ms-input-placeholder {
  color: #aeaeae
}
textarea::-webkit-input-placeholder {
  color: #aeaeae
}
/*.valid {*/
/*  color: #22a0c7*/
/*}*/
/*select[name=usecase] {*/
/*  width: 100%;*/
/*  border: 1px solid #c9c9c9;*/
/*  -moz-box-sizing: border-box;*/
/*  -webkit-box-sizing: border-box;*/
/*  box-sizing: border-box;*/
/*  -moz-border-radius: 4px;*/
/*  -webkit-border-radius: 4px;*/
/*  border-radius: 4px;*/
/*  line-height: 28px;*/
/*  margin-bottom: 28px;*/
/*  padding: 13px 14px;*/
/*  outline: none;*/
/*  -moz-appearance: none;*/
/*  -webkit-appearance: none;*/
/*  background: #f9f9f9 url("/sites/deviceatlas.com/themes/brewdock/images/static-pages/enterprise-trial/br_down.png") no-repeat;*/
/*  background-position: 94% center*/
/*}*/
.icon {
  text-align: center !important;
  position: relative
}
@media screen and (max-width: 48em) {
  .icon {
    width: 100%
  }
}
.icon .ico_svg {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto
}
.info.right {
  text-align: right
}
@media screen and (max-width: 48em) {
  .info {
    text-align: left !important
  }
}
@media screen and (min-width: 48em) {
  .pure-g.padding-zero {
    padding: 0
  }
}
@media screen and (max-width: 48em) {
  .opp-icon {
    margin: auto;
    width: 300px
  }
  .opp-icon .ico_svg {
    width: 100% !important
  }
}
.icon-wrapper {
  position: fixed;
  right: 5vw;
  bottom: 5vh
}
@media screen and (max-width: 1000px), screen and (max-height: 900px) {
  .icon-wrapper {
    display: none
  }
}
.scroll-icon {
  -moz-animation: shake 1 2s;
  -webkit-animation: shake 1 2s;
  animation: shake 1 2s;
  width: 50PX;
  height: 50px;
  min-height: 50px;
  border-radius: 50%;
  -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3)
}
@keyframes shake {
  10%,
  90% {
    transform: translate3d(-1px, 0, 0)
  }
  20%,
  80% {
    transform: translate3d(2px, 0, 0)
  }
  30%,
  50%,
  70% {
    transform: translate3d(-4px, 0, 0)
  }
  40%,
  60% {
    transform: translate3d(4px, 0, 0)
  }
}
.cloud-trial-button {
  background-color: rgba(255, 255, 255, 0.4);
  border: solid 1px transparent;
  color: white;
  font-size: 14px;
  border-radius: 4px;
  width: 30%;
  outline: none;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease
}
.cloud-trial-button:hover {
  background-color: rgba(62, 207, 171, 0.8);
  border: solid 1px #3ecfab;
  -moz-box-shadow: 0px 0px 7px 1px rgba(62, 207, 171, 0.8);
  -webkit-box-shadow: 0px 0px 7px 1px rgba(62, 207, 171, 0.8);
  box-shadow: 0px 0px 7px 1px rgba(62, 207, 171, 0.8)
}
@media screen and (max-height: 700px), (max-width: 700px) {
  .contact-popup {
    opacity: 0
  }
}
.case-gradient {
  background-color: #22a0c7;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuMCIgeDI9IjEuMCIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIzYWM5ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIxOTRmMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -moz-linear-gradient(315deg, #23ac9d, #2194f1);
  background-image: -webkit-linear-gradient(315deg, #23ac9d, #2194f1);
  background-image: linear-gradient(135deg, #23ac9d, #2194f1)
}
.case-gradient .quote {
  font-size: 22px;
  color: white
}
.case-gradient .pure-u-sm-5-5 {
  margin: auto
}
.case-gradient .caselogo {
  text-align: center !important;
  position: relative;
  width: 100%;
  height: 100%
}
.case-gradient .caselogo p {
  color: white !important;
  font-size: 18px
}
.case-gradient .caselogo .logo {
  border: 8px solid;
  -moz-background-clip: padding;
  -o-background-clip: padding-box;
  -webkit-background-clip: padding;
  background-clip: padding-box;
  border-color: rgba(255, 255, 255, 0.2);
  background-color: #fff;
  height: 140px;
  border-radius: 50%;
  width: 140px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto
}
.case-gradient .caselogo .logo svg,
.case-gradient .caselogo .logo img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto
}
@media screen and (max-width: 48em) {
  .case-gradient .caselogo .logo {
    position: relative;
    margin: auto !important
  }
}
.case-studies {
  color: #616464
}
.case-studies p {
  font-size: 20px;
  color: #616464
}
.case-studies h4 {
  font-size: 24px
}
.case-studies .linestarter {
  color: #22a0c7;
  background-color: #22a0c7;
  height: 24px;
  font-size: 22px;
  margin-right: 6px
}
.case-studies .pure-g {
  margin: 3em auto !important;
  padding: 0 !important
}
.case-studies .pure-u-sm-5-5 {
  margin: auto
}
@media screen and (max-width: 35.5em) {
  .case-studies .pure-u-sm-5-5 {
    width: 100% !important
  }
}
.case-studies .figures {
  text-align: center;
  margin: auto
}
.case-studies .figures h1 {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 48px !important
}
.case-studies .figures p {
  font-size: 22px;
  color: #7e7e7e;
  margin: 0
}
@media screen and (max-width: 48em) {
  .case-studies .figures {
    clear: both;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px
  }
}
.case-studies .content.table {
  margin-top: 18px
}
.case-studies .content h2 {
  margin-top: 0 !important
}
.case-studies .content img {
  margin-top: 80px
}
.case-studies .content .customer-table {
  text-align: center;
  background-color: white !important;
  border: solid 1px #e8e8e8;
  width: 90%;
  font-size: 20px;
  padding: 20px 0;
  border-radius: 8px;
  -moz-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1)
}
.case-studies .content .customer-table .tablegutter {
  margin-bottom: 14px
}
.case-studies .content .customer-table .tablegutter span {
  padding-left: 14px;
  padding-right: 14px;
  display: block
}
.case-studies .content .customer-table .tablegutter span.blue {
  color: #22a0c7
}
@media screen and (max-width: 48em) {
  .case-studies .content .customer-table {
    margin: auto;
    width: 100%
  }
}
.case-studies .content .customer-table a {
  color: #616464;
  text-decoration: none
}
.case-studies .content .customer-table a:hover {
  color: #22a0c7
}
.case-studies .content .right-side {
  float: right;
  padding: 0 !important;
  margin-bottom: 20px !important
}
.case-studies .content .right-side h4 {
  line-height: 20px !important
}
.case-studies .content .case-pic {
  margin-top: 20px;
  width: 100%
}
.case-studies .content .case-studies-source-link {
  float: left;
  font-size: 0.7em
}
.tbl-drop {
  margin-right: auto;
  margin-left: auto;
  margin-top: 30px;
  margin-bottom: 8px;
  font-size: 16px;
  outline: none !important
}
@-moz-document url-prefix() {
  .tbl-drop {
    letter-spacing: 0 !important
  }
}
.property-table {
  width: 100% !important;
  text-align: center !important;
  display: none
}
.property-table tr td:nth-of-type(2) {
  text-align: left
}
.sticky-table {
  border-collapse: collapse
}
.sticky-table thead {
  margin: 0 !important;
  padding: 0 !important
}
.sticky-table.mod {
  margin-top: 0
}
@media screen and (min-width: 720px) {
  .sticky-table.mod {
    overflow-x: hidden
  }
}
.sticky-table.mod .top-header {
  cursor: pointer
}
.sticky-table.mod .top-header th {
  background-color: #4467d3;
  padding: 6px 20px !important;
  font-size: 18px;
  text-align: center
}
.sticky-table.mod .top-header th .plus-sign {
  background-color: white;
  border-bottom: none !important;
  cursor: pointer;
  position: absolute;
  width: 18px;
  height: 1px;
  top: 20px;
  right: 20px;
  -moz-transition: -moz-transform 0.6s ease;
  -o-transition: -o-transform 0.6s ease;
  -webkit-transition: -webkit-transform 0.6s ease;
  transition: transform 0.6s ease
}
.sticky-table.mod .top-header th .plus-sign.grey {
  background-color: #393d3d !important
}
.sticky-table.mod .top-header th .plus-sign.grey::before {
  background-color: #393d3d !important
}
.sticky-table.mod .top-header th .plus-sign::before {
  -moz-transition: -moz-transform 0.6s ease;
  -o-transition: -o-transform 0.6s ease;
  -webkit-transition: -webkit-transform 0.6s ease;
  transition: transform 0.6s ease;
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  content: '';
  left: 0;
  width: 18px;
  height: 1px;
  position: absolute;
  background-color: white
}
.sticky-table.mod .top-header th .plus-sign.active::before {
  -moz-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg)
}
.sticky-table.mod .top-padding td {
  border: none
}
.sticky-table.mod tbody.category {
  display: none
}
.sticky-table.mod tbody.category tr td {
  border-left: 1px solid #e3e3e3;
  border-right: 1px solid #e3e3e3;
  text-align: left !important
}
.sticky-table.mod tbody.category tr td:first-child {
  border-left: none;
  min-width: 9em;
}
@media screen and (max-width: 960px) {
  .sticky-table.mod tbody.category tr td:first-child {
    min-width: 5em;
  }
}
.sticky-table.mod tbody.category tr td:last-child {
  border-right: none;
  width: 100%
}
.search-top {
  opacity: 0
}
a:hover > .search-icon .sline {
  stroke: white
}
a:hover > .search-icon .spath {
  fill: white
}
.search-icon {
  cursor: pointer;
  position: relative;
  margin-top: 0.1%
}
.search-icon .sline {
  fill: none;
  stroke: #868380;
  stroke-miterlimit: 10
}
.search-icon .spath {
  fill: #868380;
  stroke: none
}
.search-icon.btn .sline {
  stroke: #22a0c7
}
.search-icon.btn .spath {
  fill: #22a0c7
}
.search-icon.mobi .sline {
  stroke: #616464
}
.search-icon.mobi .spath {
  fill: #616464
}
.search-icon.mobi.active .sline {
  stroke: white
}
.search-icon.mobi.active .spath {
  fill: white
}
.search-icon.active .sline {
  stroke: #23ac9d
}
.search-icon.active .spath {
  fill: #23ac9d
}
.search-icon + a {
  margin-left: 10px
}
#homepage-navbar .search-top {
  display: none;
  font-size: 14px;
  width: 120px;
  height: 24px;
  background-color: transparent;
  padding: 0 5px !important;
  border: solid 1px rgba(255, 255, 255, 0.6);
  color: rgba(255, 255, 255, 0.8);
  border-radius: 4px;
  position: absolute;
  top: 4px;
  left: -126px
}
#homepage-navbar .search-icon .sline {
  stroke: rgba(255, 255, 255, 0.6)
}
#homepage-navbar .search-icon .spath {
  fill: rgba(255, 255, 255, 0.6)
}
#homepage-navbar .search-icon:hover .sline {
  stroke: #fff
}
#homepage-navbar .search-icon:hover .spath {
  fill: #fff
}
.search-gradient {
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIzOWZhMyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIxOGZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #239fa3), color-stop(100%, #218fd9));
  background: -moz-linear-gradient(top, #239fa3, #218fd9);
  background: -webkit-linear-gradient(top, #239fa3, #218fd9);
  background: linear-gradient(to bottom, #239fa3, #218fd9)
}
.search-page {
  margin-top: 0;
  text-align: center;
  padding-bottom: 20px !important
}
.search-page h2 {
  font-size: 30px
}
.search-page .search-bar {
  margin: auto;
  text-align: center
}
.search-page .search-bar .search-field {
  display: inline-block
}
.search-page .search-bar .search-field input {
  background-color: rgba(255, 255, 255, 0.7);
  border: solid 1px white;
  border-radius: 4px 0px 0px 4px;
  -moz-transition: background-color 0.3s;
  -o-transition: background-color 0.3s;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  width: 400px
}
@media screen and (max-width: 1080px) {
  .search-page .search-bar .search-field input {
    width: 290px !important
  }
}
@media screen and (max-width: 801px) {
  .search-page .search-bar .search-field input {
    width: 260px !important
  }
}
@media screen and (max-width: 381px) {
  .search-page .search-bar .search-field input {
    width: 200px !important
  }
}
@media screen and (max-width: 300px) {
  .search-page .search-bar .search-field input {
    width: 160px !important
  }
}
.search-page .search-bar .search-field input:focus {
  background-color: rgba(255, 255, 255, 0.8)
}
.search-page .search-bar .search-btn {
  display: inline-block
}
.search-page .search-bar .search-btn button {
  position: relative;
  left: -5px;
  border-radius: 0px 4px 4px 0px;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0;
  color: #22a0c7;
  padding: 14px 20px;
  font-size: 18px;
  border: none;
  outline: none !important;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s
}
.search-page .search-bar .search-btn button:hover {
  background-color: rgba(255, 255, 255, 0.9)
}
.search-results {
  margin-top: -40px;
  min-height: 40vh
}
@media screen and (max-width: 720px) {
  .search-results h2 {
    font-size: 24px !important;
    line-height: 30px !important
  }
}
.search-results hr {
  background-color: #95989a;
  margin-top: 10px;
  height: 1px;
  border: none;
  opacity: .2;
  width: 100%
}
.search-results ul {
  list-style: none;
  margin: 0;
  margin-top: 60px;
  padding: 0;
  text-align: center
}
.search-results ul li {
  display: inline;
  margin-left: 4px;
  margin-right: 4px
}
.search-results ul li a {
  font-size: 24px;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  padding: 6px 14px;
  text-decoration: none
}
.search-results ul li a:hover,
.search-results ul li a.active {
  background-color: #22a0c7;
  color: white
}
@media screen and (max-width: 270px) {
  .search-results ul li a {
    font-size: 16px
  }
}
.search404 {
  padding-top: 100px !important;
  width: 100%;
  text-align: center;
  padding-bottom: 20px !important
}
.search404 p {
  text-align: center !important;
  color: white
}
.search404 h1 {
  color: white !important;
  font-weight: 200 !important;
  font-size: 48px !important
}
.search404 h2 {
  font-size: 30px;
  color: white
}
.search404 span.link-separator {
  color: #d7d7d7
}
.search404 .search-bar {
  width: 100%;
  text-align: center
}
.search404 .search-bar .search-field {
  display: inline-block
}
.search404 .search-bar .search-field input {
  background-color: rgba(255, 255, 255, 0.7);
  border: solid 1px white;
  border-radius: 4px 0px 0px 4px;
  -moz-transition: background-color 0.3s;
  -o-transition: background-color 0.3s;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  width: 360px
}
@media screen and (max-width: 1141px) {
  .search404 .search-bar .search-field input {
    width: 230px !important
  }
}
@media screen and (max-width: 796px) {
  .search404 .search-bar .search-field input {
    width: 210px !important
  }
}
@media screen and (max-width: 381px) {
  .search404 .search-bar .search-field input {
    width: 180px !important
  }
}
@media screen and (max-width: 300px) {
  .search404 .search-bar .search-field input {
    width: 160px !important
  }
}
.search404 .search-bar .search-field input:focus {
  background-color: rgba(255, 255, 255, 0.8)
}
.search404 .search-bar .search-btn {
  display: inline-block
}
.search404 .search-bar .search-btn button {
  position: relative;
  left: -5px;
  border-radius: 0px 4px 4px 0px;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0;
  padding: 14px 20px;
  font-size: 18px;
  border: none;
  outline: none !important;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s
}
.search404 .search-bar .search-btn button:hover {
  background-color: rgba(255, 255, 255, 0.9)
}
.links404 {
  margin-top: 10px !important
}
.links404 p {
  width: 100% !important;
  text-align: center !important
}
.links404 a.horizontals {
  margin-left: 8px;
  margin-right: 8px
}

/* Added Rachid */

.navbar:not(#inverted) {
  position: absolute !important;
}
#container, #container-down {
  padding-top: 0px;
}
#container-up {
  padding-top: 140px;
}
#container-down, .container-content {
  max-width: 100% !important;
}
.html5-aside + h1,
.html5-aside + h1 + h2 {
  display: none;
}
#container-down h1 {
  margin: 28px auto;
}

/* loader */

.loading {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.1);
}
.loader {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -2.5em;
  width: 80px;
  height: 80px;
}
.loader div {
  transform-origin: 40px 40px;
  animation: loader 1.2s linear infinite;
}
.loader div::after {
  content: " ";
  display: block;
  position: absolute;
  top: 3px;
  left: 37px;
  width: 6px;
  height: 18px;
  border-radius: 20%;
  background: currentColor;
}
.loader div:nth-child(1) {
  transform: rotate(0deg);
  animation-delay: -1.1s;
}
.loader div:nth-child(2) {
  transform: rotate(30deg);
  animation-delay: -1s;
}
.loader div:nth-child(3) {
  transform: rotate(60deg);
  animation-delay: -0.9s;
}
.loader div:nth-child(4) {
  transform: rotate(90deg);
  animation-delay: -0.8s;
}
.loader div:nth-child(5) {
  transform: rotate(120deg);
  animation-delay: -0.7s;
}
.loader div:nth-child(6) {
  transform: rotate(150deg);
  animation-delay: -0.6s;
}
.loader div:nth-child(7) {
  transform: rotate(180deg);
  animation-delay: -0.5s;
}
.loader div:nth-child(8) {
  transform: rotate(210deg);
  animation-delay: -0.4s;
}
.loader div:nth-child(9) {
  transform: rotate(240deg);
  animation-delay: -0.3s;
}
.loader div:nth-child(10) {
  transform: rotate(270deg);
  animation-delay: -0.2s;
}
.loader div:nth-child(11) {
  transform: rotate(300deg);
  animation-delay: -0.1s;
}
.loader div:nth-child(12) {
  transform: rotate(330deg);
  animation-delay: 0s;
}
@keyframes loader {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}