body {
  font-family: 'din-2014', sans-serif;
}

.blue {
  background: #00689f;
}

body h1 {
  font-family: 'din-condensed', sans-serif;
  font-weight: 300;
  letter-spacing: 1px;
  font-size: 32px;
}

form {
  font-family: 'din-2014', sans-serif;
}

p {
  font-weight: 300;
}

h3 {
  font-size: 19px;
  line-height: 1.2;
}

/* Header/Navigation Overrides */
/* ------------------------------- */

.applogo {
  object-fit: scale-down;
  height: 42px;
  width: 118px;
}

.navbar {
  min-height: 50px;
  margin-bottom: 0px;
  border: 1px solid transparent;
  border-bottom: 1px solid white;
}

.navbar-default {
  //background-color: transparent;
  background-color: rgba(255, 255, 255, 1);
  color: white;
}

.navbar-default .navbar-nav > li > a {
  color: white;
}

.navbar-default .navbar-brand {
  color: white;
  min-height: 50px;
  /* background-color: rgba(0, 0, 0, 0.5); */
  /* border-right: 1px solid rgba(0, 0, 0, 0.2); */
}

.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  /* background-color: rgba(0, 0, 0, 0.5); */
}

.navbar-brand {
  height: 50px;
  padding: 4px 20px;
}

.navbar-default .navbar-nav > li > a {
  color: white;
  border: 1px solid white;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1px;
  padding-top: 2px;
  padding-bottom: 2px;
  margin-right: 20px;
}

.navbar-default .navbar-nav > li > a:hover {
  color: white;
}

.navbar-default .navbar-nav > li > a:active {
  color: white;
}

.navbar-default .navbar-nav > li > a.white {
  background: white;
  color: #111b2e;
}

.navbar-default .navbar-nav > li > a.white:hover {
  color: #111b2e;
}

.navbar-default .navbar-nav > li > a.white:active {
  color: #111b2e;
}

.navbar-right {
  margin-right: 0px;
  padding-top: 8px;
}

.vertical_nav {
  z-index: 2;
  top: 50px;
  background-color: rgba(0, 0, 0, 0.5);
}

.vertical_nav .menu--link {
  -webkit-transition: padding-left 0.8s, -webkit-transform 0.8s;
  transition: padding-left 0.8s, transform 0.8s;
}

.vertical_nav__minify .menu--link {
  padding-left: 0px;
}

.header {
  border-bottom: solid 1px white;
}

.header .container-fluid {
  padding-left: 0px;
  padding-right: 0px;
}

.menu {
  top: 0px;
}

.menu--link {
  display: block;
  overflow: hidden;
  font-size: 12px;
  text-decoration: none;
  color: white;
  font-weight: 300;
  white-space: nowrap;
  cursor: pointer;
  padding-top: 13px;
  padding-bottom: 13px;
  border-bottom: solid 1px #82939f;
  letter-spacing: 2px;
  padding-left: 40px;
}

a.menu--link:hover {
  border-right: 5px solid #00a7ff;
  text-decoration: none;
}

a.menu--link:active,
a.menu--link:focus {
  color: white;
  text-decoration: none;
}

label {
  margin-bottom: 0px;
}

/* Backgrounds will cover all the section
* --------------------------------------- */
.section {
  background-size: cover;
  color: white;
}

.black {
  color: black;
}

.white {
  color: white;
}

.loading {
  color: #d1d3d4;
  font-size: 30px;
  text-align: center;
  margin-top: 200px;
}

/* Defining each section background and styles
* --------------------------------------- */
#section0 {
  background-image: url(../images/ag_bg_0.jpg);
  padding: 0% 0 0 0;
  color: white;
}
#section1 {
  background-image: url(../images/ag_bg_1.jpg);
  padding: 0% 0 0 0;
}
#section2 {
  background-image: url(../images/ag_bg_2.jpg);
  padding: 0% 0 0 0;
}
#section3 {
  background-image: url(../images/ag_bg_3.jpg);
  padding: 0% 0 0 0;
}
#section4 {
  background-image: url(../images/ag_bg_4.jpg);
  padding: 0% 0 0 0;
}

#workstation {
  position: fixed;
  top: 52%;
  left: 45%;
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  max-width: 620px;
}

.workstation-vertical-slider {
  position: absolute;
  left: 4.4%;
  top: 5%;
  right: 0;
  bottom: 0;
  height: 63.7%;
  width: 91.4%;
}

.swiper-container {
  margin: 0 auto;
  overflow: hidden;
}

.swiper-container,
.swiper-slide {
  width: 100%;
  height: 100%;
  position: relative;
  color: white;

  vertical-align: center;
  text-align: center;
}

.slide-1 {
  background-color: rgba(0, 0, 0, 0.5);
}

.slide-2 {
  background-color: rgba(0, 0, 0, 0.5);
}

.slide-3 {
  background-color: rgba(0, 0, 0, 0.5);
}

.image-slide .container-fluid {
  padding: 0px;
}

/* APP OVERVIEW */
/***************************************/

.app-overview .col .app-wrap {
  border: 1px solid white;
  text-align: center;
  padding: 0px;
  padding-bottom: 0px;
}

.app-overview .col {
  //padding-right: 10px;
}

.app-overview .row {
  padding: 20px;
  padding-left: 15px;
  padding-right: 15px;
}

.app-overview .col .app-wrap img {
  width: 65px;
}

.app-overview .col .app-wrap h3 {
  margin-top: 10px;
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 0px;
}

.app-overview .col .app-wrap h4 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.3;
}

.app-overview .col .app-wrap p {
  font-size: 12px;
  font-weight: normal;
}

.app-overview .col .app-wrap hr {
  border-top: 1px solid #00a7ff;
  width: 50%;
  margin-top: 12px;
  margin-bottom: 12px;
}

.app-overview .col .app-wrap .btn-default {
  width: 100%;
  background-color: #cccdce;
  color: black;
  border-color: #cccdce;
  border-radius: 0px;
  font-size: 11px;
  padding: 4px 12px;
}

.app-overview .col .app-wrap .btn-default:hover {
  color: white;
  background-color: #40a4da;
  border-color: #40a4da;
}

.app-overview .col .app-wrap .pad {
  padding: 20px;
  height: 245px;
  padding-top: 15px;
}

.highlight {
  //margin-top: -200px;
}

.highlight hr {
  border-top: 2px solid #00a7ff;
}

.technology hr {
  border-top: 2px solid #00a7ff;
}

.technology ul {
  padding: 15px;
  font-size: 12px;
}

.technology ul li {
  text-transform: uppercase;
  margin-bottom: 5px;
}

.fp-tableCell {
  position: absolute;
}

.highlight .col {
  padding-left: 60px;
}

/* Form Overrides */
/*************************************/

.btn-ag {
  color: #fff;
  background-color: #0d91d8;
  border-color: #0d91d8;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 2px;
  border-radius: 0px;
  padding: 8px 12px;
}

.btn-ag:hover {
  color: #fff;
  background-color: #0b7cb8;
  border-color: #0b7cb8;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 2px;
  border-radius: 0px;
  padding: 8px 12px;
}

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 11px;
  color: #aaa;
  font-weight: 300;
}
::-moz-placeholder {
  /* Firefox 19+ */
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 11px;
  color: #aaa;
  font-weight: 300;
}
:-ms-input-placeholder {
  /* IE 10+ */
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 11px;
  color: #aaa;
  font-weight: 300;
}
:-moz-placeholder {
  /* Firefox 18- */
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 11px;
  color: #aaa;
  font-weight: 300;
}

.form-panel {
  display: block;
  margin-top: 40px;
}

.panel.panel-form.ag,
.panel.panel-form.ag .panel-body {
  background: transparent;
  border: 0px;
}

.panel.ag,
.panel.ag .panel-heading {
  background: transparent;
  border-bottom: 0px;
}

.panel.panel-form.ag .panel-heading .title {
  font-family: 'din-condensed', sans-serif;
  font-size: 47px;
  position: relative;
  margin: 0 0 10px;
  font-weight: 400;
  color: #fff;
  text-shadow: 0px 0px 0 rgba(0, 0, 0, 0.1);
  letter-spacing: 3px;
}

.panel.panel-form .panel-heading .title:before {
  border-bottom: 0px solid #00a7ff;
}

.panel.panel-form.ag hr {
  border-bottom: 2px solid #5cd4ff;
  border-top: 0px;
}

.form-control-feedback {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  pointer-events: none;
  color: #575757;
}

.has-feedback .form-control {
  padding-left: 45px;
}

.content-wrapper {
  padding-top: 70px;
}

.panel.panel-form.ag p {
  color: white;
  font-weight: 300;
  font-size: 11px;
  letter-spacing: 2px;
}

.checkbox {
  display: inline-block;
}

label.custom-option .button-checkbox,
label.custom-option .button-radio {
  border: 1px solid #ccc;
  background: transparent;
}

label.custom-option input[type='checkbox']:checked + .button-checkbox,
label.custom-option input[type='radio']:checked + .button-radio {
  border-color: white;
}

label.custom-option.button input[type='checkbox'] + .button-checkbox:after,
label.custom-option.button input[type='radio'] + .button-radio:after {
  display: none;
  top: 5px;
  bottom: 5px;
  left: 5px;
  width: 8px;
  background: white;
}

.radio label,
.checkbox label {
  color: white;
  font-weight: 300;
  letter-spacing: 2px;
  font-size: 11px;
  min-height: 20px;
}

.btn-link {
  color: white;
  font-weight: normal;
  border-radius: 0;
}

.btn-link:hover,
.btn-link:focus {
  color: white;
  text-decoration: underline;
  background-color: transparent;
}

.technology {
  padding-top: 8%;
}

.gray {
  background: #bcbec0;
}

.app-callout .img-responsive {
}

.app-callout .row {
  margin-left: 0px;
  margin-right: 0px;
}

.app-callout .row .col {
  padding-left: 0px;
  padding-right: 0px;
}

.app-callout h2 {
  margin-top: 10px;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 2px;
  margin-bottom: 0px;
}

.app-callout h4 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.2;
  font-weight: 300;
}

.app-callout p {
  color: #414042;
  font-weight: 300;
  font-size: 12px;
  text-align: center;
  margin-bottom: 10px;
}

.app-callout hr {
  width: 40%;
  margin-top: 10px;
  margin-bottom: 10px;
  border: 0;
  border-top: 1px solid #00a7ff;
}
.callout-wrap {
  padding: 18px;
  height: 315px;
}

.callout-wrap img {
  width: 60px;
}

.app-callout .fill {
  height: 315px;
}

.app-callout .fill img {
  left: 0px !important;
}

/*************************************/

[class^='icon-']:before,
[class*=' icon-']:before {
  margin-left: 0.3em;
}

/* Users */
/*************************************/

body.users {
  background: #f6f6f6;
}

.users .heading {
  color: #939598;
}

.users .heading {
  font-weight: 300;
  font-size: 11px;
  letter-spacing: 2px;
}

.users .heading hr {
  border-top: 2px solid #33b9ff;
}

/* App Selection */
/*************************************/

.app-option {
  color: #939598;
}

.users .vertical_nav {
  position: fixed;
}

.app-option .pad {
  padding: 20px 15px;
  background: white;
  margin: 5px;
  transition: all 0.3s;
}

.app-option h3 {
  font-weight: 600;
  letter-spacing: 2px;
}

.app-option h4 {
  font-weight: 300;
  line-height: 1.3;
  letter-spacing: 2px;
  font-size: 15px;
}

.app-option i.menu--icon {
  float: none;
  margin: 0 auto;
  width: auto;
  height: auto;
  font-size: 90px;
  margin-left: 0em;
}

.app-option .btn-ag {
  margin-top: 8px;
  background-color: #33b9ff;
  border-color: #33b9ff;
}

.app-option .btn-ag:hover {
  background-color: #959595;
  border-color: white;
}

.pad.hover {
  background-color: #959595;
  color: white;
}

.app-option [class^='icon-']:before,
.app-option [class*=' icon-']:before {
  margin-left: 0em;
}

.users .navbar-default .navbar-nav > li > a {
  color: #959595;
  border: 0px solid white;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1px;
  padding-top: 2px;
  padding-bottom: 2px;
  margin-right: 20px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.users .navbar-default .navbar-nav > li > a > i.menu--icon {
  display: block;
  float: left;
  width: 35px;
  height: 20px;
  line-height: 20px;
  font-size: 21px;
}

.users .navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  background-color: inherit;
  color: #555;
}

@media (max-width: 1250px) {
  #workstation {
    left: 42%;
  }
}

@media (max-width: 1200px) {
  .highlight h1 {
    font-size: 40px;
  }

  .app-option [class^='icon-']:before,
  .app-option [class*=' icon-']:before {
    margin-left: 0em;
  }
}

input[type='search'] {
  -webkit-appearance: searchfield;
}
input[type='search']::-webkit-search-cancel-button {
  -webkit-appearance: searchfield-cancel-button;
}