body {
  font-family: 'IBM Plex Sans', sans-serif;
  font-weight: 400;
}

a { color: #8ac2e9} 
a:hover { color: #5892b7}

h1,h2,h3,h4,h5 {
  font-family: 'IBM Plex Sans Condensed', sans-serif;
  font-weight: 600;
  font-style: italic;
}

section {
  padding-top: 100px;
  padding-bottom: 80px;
}
section.call-to-action {
  padding-top: 60px;
  padding-bottom: 40px;
}

section#home {
  padding-top: 40vh;
  padding-bottom: 20vh;
  background: radial-gradient(rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0)), url('../imgs/work-share-documents.jpg') no-repeat center center;
  background-image: url('../imgs/work-share-documents.jpg') no-repeat center center;
  background-size: cover;
}
section#home h1, 
section#home p{
  color: #fff;
  text-shadow: 0px 0px 5px rgba(50, 50, 50, 0.7);
}

.bg-primary {
  background-color: #8ac2e9 !important;
}

.text-primary {
  color: #8ac2e9 !important;
}

.border-primary {
  border-color: #8ac2e9 !important;
}

.btn { font-weight: 600; }

.btn-primary, .btn-outline-primary:hover {
    color: #fff;
    background-color: #8ac2e9;
    border-color: #8ac2e9;
}

.btn-primary:hover {
    color: #fff;
    background-color: #5892b7;
    border-color: #5892b7;
}

.btn-primary:disabled {
  background-color: #ccc;
  border-color: #ccc;  
}

.btn-outline-primary {
  border-color: #8ac2e9;
  color: #8ac2e9;
}

header.navbar {
  padding-top: 25px;
  padding-bottom: 25px;
  transition: all .3s;
  border: none;
  background-color: transparent !important;
  color: #fff;
}
header.navbar:not(.navbar-shrink) .nav-link { color:#fff; }

header.navbar.navbar-shrink {
  padding-top: 0;
  padding-bottom: 0;
  background-color: #8ac2e9 !important;
}

header.navbar .navbar-brand {
  font-size: 2em;
  line-height: 3em;
  transition: all .3s;
  color: #fff;
  font-style: italic;
  margin: auto;
}

header.navbar:not(.navbar-shrink) .navbar-toggler {
  display: none;
}

header.navbar .navbar-brand img {
  height: 100px;  
}

header.navbar.navbar-shrink .navbar-brand {
  font-size: 1.5em;
  line-height: 1.75em;
  margin-left:0;
}

header.navbar.navbar-shrink .navbar-brand img {
  height: 50px;
}

#features #demo-bkg {
  background: url('../imgs/app-login.png') no-repeat center center;
  background-size: cover;
}

#how ol {
  counter-reset: num-list;
  list-style-type: none;
  padding:0;
}

#how ol li::before {
  position: absolute;
  content: counter(num-list);
  counter-increment: num-list;
  font-size: 40px;
  line-height: 60px;
  top: 0;
  left: 15px;
  background-color: #8ac2e9;
  width: 60px;
  text-align: center;
  border-radius: 100%;
  color: #fff;
}

#how ol li {
  padding-left: 100px;
  padding-bottom: 30px;
}


#faq { border-top: 5px dashed #8ac2e9;}
#faq ul {list-style: none;}
#faq li {padding-bottom: 20px;}
#faq p {padding-left: 15px; padding-top:10px;}
#faq a {font-size:1.3em; }

footer a { color: #fff; }