@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
body {
    font-family: 'Poppins', sans-serif;
    background: #fafafa;
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #6d6e71;
}

a,
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}

p a {
    color: #0096cc;
    text-decoration: underline;
}

.install-list a {
    color: #0096cc;
    text-decoration: underline;
}

.hint a {
    color: #0096cc;
    text-decoration: underline;
}

h1 {
    font-size: 30px;
}

h2 {
    font-size: 25px;
}

h3 {
    font-size: 20px;
}

/*======================================
  Top Navbar
======================================*/
.navbar {
  min-height:46px !important;
  padding-top: 6px;
}

.navbar-custom {
  background-color:  #E8E8E8;
  color:#ffffff;
  border-radius: 0;
}

.navbar-custom a:hover {
  text-decoration: none;
}

.navbar-custom a:focus {
  outline:none;
}

.navbar-fixed-top {
  top: 22px;
  width: 100%;
}

.navbar-custom .navbar-nav > li > a {
  color:#fff;
  padding: 0;
  margin-top: 8px;
}

.navbar-custom .navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color:transparent;
}

/* this is for the menu button placement */
.navbar-custom .navbar-brand {
  position: absolute;
  /* color:#eeeeee; */
  color: black;
  padding-top: 5px;
  height: 34px;
  z-index: 1;
}

.navbar-custom .navbar-brand:hover {
  color: #909090;
}

.navbar-custom .navbar-brand:focus {
  outline: none;
}

.nav-title-a {
    /*position: relative;*/
    color:#989898;
    font-size:x-large;
    font-family: proxima-nova, sans-serif;
    /*z-index: -1;*/
    margin-left: 21px;
    font-weight: 900;
}

.nav-title-b {
    color:#FFFFFF;
    font-size:x-large;
    font-family: proxima-nova, sans-serif;
    margin-left: -4px;
    font-weight: 900;
}

.nav-subtitle {
    /*position: relative;*/
    color: #989898;
    font-size:small;
    margin-left: 10px;
    font-family: proxima-nova, sans-serif;
    /*z-index: -1;*/
}

.nav-logo {
    height: auto;
    max-height: 38px;
    padding-left : 8px;
}

.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}

#sidebar {
    min-width: 250px;
    max-width: 250px;
    background: #6d6e71;
    color: #fff;
    transition: all 0.3s;
}

#sidebar.active {
    margin-left: -250px;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #fafafa;
}

#sidebar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid #47748b;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

#sidebar #icon i, #sidebar #left-icon i{
    font-size: 40px;
    padding: 10px;
}

#sidebar #version {
    text-align: center;
    display: block;
}

#sidebar #side-copy {
    text-align: center;
    display: block;
}

#sidebar ul li a:hover {
    color: #6d6e71;
    background: #fff;
}

#sidebar ul li.active>a,
a[aria-expanded="true"] {
    color: #fff;
    background: #00aeef;
}

.social {
    text-align: center;
}

a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #00aeef;
}

ul.CTAs {
    padding: 20px;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}

a.download {
    background: #fff;
    color: #7386D5;
}

a.article,
a.article:hover {
    background: #6d7fcc !important;
    color: #fff !important;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
    padding: 20px;
    min-height: 100vh;
    transition: all 0.3s;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */

@media (max-width: 768px) {
    #sidebar {
        margin-left: -250px;
    }
    #sidebar.active {
        margin-left: 0;
    }
    #sidebarCollapse span {
        display: none;
    }
}

/*======================================
  Banner
======================================*/
.banner {
  position: relative;
  background-color: #454545;
  padding-top: 1px;
  padding-bottom: 3px;
  width: 100%;
  margin-bottom: -24px;
  z-index: 1;
}

.banner .text-right {
  margin-right: 0;
}

.banner .far-right {
  margin-right: 17px;
}

.banner a {
  color: white;
  font-family: Verdana,Geneva,sans-serif;
  text-decoration: none;
  margin-left: 18px;
  font-size: small;
}

.banner a:hover i, a:hover {
  color: #909090;
}

.banner i {
  color: #CCCCCC;
  margin-left: 5px;
}

/* Pre and code styling */
#content pre code {
    font-family: Pragmata, Menlo, 'DejaVu LGC Sans Mono', 'DejaVu Sans Mono', Consolas, 'Everson Mono', 'Lucida Console', 'Andale Mono', 'Nimbus Mono L', 'Liberation Mono', FreeMono, 'Osaka Monospaced', Courier, 'New Courier', monospace;
    line-height: 1.6em;
    font-size: 14px;
}

#content ol li, #content ul li {
  margin-top: 1px;
  margin-bottom: 1px;
  padding: 10px;
}

#content pre {
    overflow: auto;
    width: 93%;
    background-color: none;
}

#content p code {
    background-color:  #d9d9d9;
}

/* Modals ---------------------------------------- */

.modal-title {
    color: #6d6e71;
    text-align: center;
}

.btn-cite {
    background-color: #6d6e71;
}

.btn-cite:hover {
    background-color: #bebfc1;
}