/*
 main header: #2d2d32
 secondary header: #f28d1a

 light grey: #f3f4f5;
 colors danger/error: #ff4533 #cd3729
 colors warning: #ed9e2e #F28D1A
 colors success: #83c129 #69ad21
 colors default: #bbbfc4 #a5aab0

 */

@import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
@import '../node_modules/bootstrap/dist/css/bootstrap-theme.min.css';

/** Open Sans from https://gwfh.mranftl.com/fonts/open-sans?subsets=latin */
/* open-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../web/font/open-sans-v40-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: url('../web/font/open-sans-v40-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../web/font/open-sans-v40-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../web/font/open-sans-v40-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../web/font/open-sans-v40-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fontello */
@font-face {
    font-family: 'fontello';
    src: url('../web/font/fontello.eot');
    src: url('../web/font/fontello.eot?#iefix') format('embedded-opentype'),
    url('../web/font/fontello.woff') format('woff'),
    url('../web/font/fontello.ttf') format('truetype'),
    url('../web/font/fontello.svg#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {
    height: 100%;
}

pre, code {
    background: #fff;
    font-family: "Source Code Pro", Menlo, Consolas, "Courier New", Courier, monospace;
    border-radius: 0;
    border: none;
    color: #2d2d32;
    line-height: 12px;
    font-size: 12px;
}
pre {
  border-left: 2px solid #f28d1a;
}
code.hljs { display: inline; }

label {
  display: block;
  font-weight: normal;
}

body {
    background: #FAFAFA;
    font-family: 'Open Sans', sans-serif;
    padding-top: 58px;
}
.logo {
  position: absolute;
  width: 100px;
  left: -98px;
  top: -43px;
}
@media (min-width: 1200px) {
  .logo {
    width: 80px;
    left: -90px;
  }
}

hr {
  border-color: #F28D1A;
}
a, .package .package-aside a {
  color: #B34E22;
}
a:hover, .package .package-aside a:hover {
  color: #2d2d32;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
}
i, cite, em, var, address, dfn {
  font-style: italic;
  font-weight: 300;
}
strong {
  font-weight: 600;
}
.h3, h3 {
    font-size: 16px;
    font-weight: 600;
}

.no-padding {
    padding: 0;
}

.navbar-wrapper {
    left: 0;
    right: 0;
    top: 0;
    min-height: 58px;
    z-index: 15;
    background: #2d2d32;
}

.banner {
    position: absolute;
    text-align: center;
    left: 50%;
    top: 9px;
    width: 340px;
    height: 40px;
    margin-left: -170px;
    background: red;
    padding: 10px;
    border-radius: 5px;
    &.alert-error::before {
        content: '';
    }
    z-index: 500;
    .banner-close {
        float: right;
        padding-top: 2px;
        cursor: pointer;
    }
}

.navbar {
    margin: 0;
    border: 0;
    -webkit-font-smoothing: subpixel-antialiased;
}

.navbar .navbar-brand {
    padding: 12px 4px;
    line-height: 32px;
    margin: 0;
}

@media (max-width: 1200px) {
    .nav-user .username-link {
        max-width: 105px !important;
    }
}
@media (max-width: 992px) {
    .nav-user .username-link {
        max-width: 200px !important;
    }
}

.navbar .navbar-brand a {
    float: left;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
}

.navbar .navbar-brand em {
    padding-left: 15px;
    padding-top: 8px;
    font-size: 14px;
    color: #f3f4f5;
}

.navbar-collapse {
    border: 0;
}

.navbar-toggle {
    background: rgba(0, 0, 0, 0.3);
    margin-top: 12px;
}

.navbar-toggle span {
    background: #fff;
}

.navbar .nav > li > a, .navbar .nav > .active > a, .navbar .nav > li > section {
    padding: 18px 25px 19px;
    background: none;
    box-shadow: none;
    text-shadow: none;
    color: #fff;
}
.nav .nav-user-signin {
    padding: 18px 25px 19px !important;
}

.navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus {
    box-shadow: none;
    color: #fff;
}


.navbar .nav > li > a:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.navbar .nav > li > a:focus {
    background: #f28d1a;
    color: #fff;
}

.navbar .nav {
    float: right;
    margin: 1px 0 0 0;
    color: #fff;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
}

.nav-user {
    position: relative;
}

.navbar .nav > li > a.nav-signout {
    padding: 19px 19px 15px;
    font-size: 22px;
}

.navbar .nav > .nav-user > section {
    cursor: pointer;
}

.navbar .nav > .nav-user > .nav-user-signin {
    padding: 17px 20px;
}

.navbar .nav > .nav-user > section > .nav-user-menu, .navbar .nav > .nav-user > section > .signin-box {
    display: none;
}

.navbar .nav > .nav-user > section:hover > .nav-user-menu,
.navbar .nav > .nav-user > section:hover > .signin-box,
.navbar .nav > .nav-user > section:focus-within > .nav-user-menu,
.navbar .nav > .nav-user > section:focus-within > .signin-box {
    display: block;
}

@media (max-width: 767px) {
    .navbar .nav { float: none; }
    .navbar .nav > li > a,
    .navbar .nav > .active > a {
        border-bottom: 1px solid rgba(118, 111, 107, 0.69);
    }
    .navbar .nav > li:last-child > a {
        border-bottom: 0;
    }
    .navbar .nav > .nav-user > section:hover > .nav-user-menu,
    .navbar .nav > .nav-user > .nav-user-signin:hover > .signin-box {
        display: none;
    }
}

.navbar .nav > .nav-user > section a {
    color: #fff;
    text-decoration: none;
    display: block;
}

.navbar .nav > .nav-user > section:hover {
    background: rgba(255, 255, 255, 0.1);
}

.navbar .nav > .nav-user > section:hover > .nav-user-menu a:hover {
    color: #f28d1a;
}

.nav-user section img {
    width: 57px;
    height: 57px;
    margin-right: 15px;
    margin-top: -5px;
}

.nav-user .username-link {
    max-width: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.nav-user .nav-user-menu, .nav-user .signin-box {
    z-index: 110;
    background: #414145;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3);
    top: 57px;
    right: 0;
    position: absolute;
}
.nav-user .nav-user-menu {
    width: 220px;
}

.nav-user .nav-user-menu ul {
    padding: 12px 15px 12px 20px;
}

.nav-user .nav-user-menu li {
    line-height: 31px;
}

.nav-user .nav-user-menu a {
    color: #fff;
}

.nav-user .nav-user-menu span {
    float: right;
    font-size: 20px;
}

.nav-user .nav-user-menu span.normal {
    float: none;
}

.nav-user .nav-user-menu hr {
    margin: 7px 0 5px;
}

.nav-user .signin-box {
    width: 300px;
    color: #fff;
}

.nav-user .signin-box form {
    padding: 15px 20px 12px;
}

.nav-user .signin-box .input-group-addon {
    background: #fff;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.nav-user .signin-box .form-control {
    border-left: 0;
    box-shadow: none;
    border-radius: 3px;
}

.nav-user .signin-box div {
    font-size: 13px;
}

.nav-user .signin-box .checkbox {
    float: left;
    margin-top: 4px;
}

.nav-user .signin-box .signin-box-buttons {
    float: left;
    width: 100%;
}

.nav-user .signin-box .signin-box-register {
    background: #f28d1a;
    float: left;
    font-size: 14px;
    font-weight: 600;
    margin: 11px 0 0;
    padding: 7px 21px;
    width: 100%;
    text-align: center;
}

.nav-user .signin-box label {
    vertical-align: middle;
}

.nav-user .btn-success {
    width: 42%;
}

.nav-user .btn-github {
    font-weight: 600;
    padding: 6px 12px 5px;
    width: 56%;
}

.nav-user .btn-github span {
    font-size: 20px;
    margin: 0 4px 0 0;
    vertical-align: bottom;
    position: relative;
    top: 2px;
}


/* overrides for dropdown menu on mobile */
@media (max-width: 767px) {
    .navbar .nav > li {
        height: 57px;
    }
    .navbar-collapse.in {
        overflow-y: visible;
    }
    .nav-user .nav-user-menu {
        right: 0;
    }
    .nav-user-signin {
        width: 100%;
    }
    .nav-user .signin-box {
        left: auto;
        right: 0;
    }
}



.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -135px;
    padding: 0 0 135px;
    position: relative;
}

.wrapper .container {
    padding: 26px 20px;
    color: #2d2d32;
}
.wrapper .container.flash-container {
  padding-bottom: 0;
}

.content p {
    font-size: 14px;
    margin-top: 10px;
    line-height: 22px;
}

.wrapper-search .container {
    padding: 10px 20px 15px;
}
@media (min-width: 768px) {
  .wrapper-search .container.with-description {
    padding-left: 143px;
  }
}
.wrapper-search .container p {
  margin-top: 8px;
  margin-bottom: 0;
}

.wrapper .container .btn-white {
    margin: -3px 0 0 5px;
}

.wrapper-search {
    background: #f28d1a;
}

.wrapper-search .container {
    color: #fff;
}

.wrapper-search a {
    color: #fff;
    border-bottom: 1px dotted rgba(255, 255, 255, 0.6);
}

.wrapper-search a:hover {
    text-decoration: none;
}

#search-container {
    margin-top: -20px;
}

#search-container em {
    font-style: normal;
    background: rgba(255, 255, 0, 0.16);
    box-shadow: 0px 0px 2px rgba(210, 210, 91, 0.67);
    border-radius: 3px;
    font-weight: inherit;
}

.search-facets {
    border-radius: 2px;
    padding: 0 15px;
    margin-top: 35px;
}
.search-facets > div:not(:last-child) > div {
    margin-bottom: 15px;
}
.search-facets .ais-menu--item__active {
    font-weight: bold;
}
.search-facets .ais-header {
    border-bottom: 1px solid #f28d1a;
    padding-bottom: 5px;
    margin-bottom: 10px;
    font-weight: bold;
}

.search-facets .ais-show-more {
    cursor: pointer;
    margin-top: 10px;
    display: inline-block;
}
.search-facets .ais-show-more:after {
    content: '...';
    display: inline-block;
}

.sbx-sffv__wrapper {
    display: flex;
    flex: 1;
    flex-direction: row;
}
.sbx-sffv__wrapper input {
    height: 22px;
    border: 1px solid #f28d1a;
    border-radius: 3px;
    margin-right: 6px;
    padding-left: 4px;
    margin-bottom: 5px;
}
.sbx-sffv__wrapper button {
    width: 22px;
    height: 22px;
    display: inline-block;
    overflow: hidden;
    padding: 2px 5px 1px;
    background: none;
    border: 0;
}
.sbx-sffv__wrapper svg {
    width: 100% !important;
    height: 100% !important;
}

.wrapper-footer {
    background: #2d2d32;
    font-size: 14px;
    line-height: 16px;
    padding: 35px 0 20px;
}
footer p {
  float: left;
  color: #c3c3c3;
}

.wrapper-footer ul {
    list-style: none;
}

.wrapper-footer li {
    padding-bottom: 8px;
}

.wrapper-footer a {
    color: #fff;
}

.wrapper-footer .social {
    font-size: 26px;
}

.wrapper-footer .social li {
    float: right;
    margin-left: 15px;
}


#search-form {
    margin-top: 5px;
}

#search-form input[type="search"] {
    background: #FFF;
    font: 18px 'Open Sans', sans-serif;
    border: 0;
    padding: 0px 10px;
    color: #2d2d32;
    outline: none;
}


button {
    font-family: 'Open Sans', sans-serif;
}

.form-group {
    clear: left;
}

.form-control {
    min-height: 20px;
    padding: 7px 11px 6px 9px;
    box-shadow: none;
    border-radius: 2px;
    font-family: 'Open Sans', sans-serif;

    transition: none;
    -o-transition: none;
    -moz-transition: none;
    -webkit-transition: none;
}

.form-control[disabled] {
    background: #fff;
}

.form-control:focus {
    padding: 6px 9px 5px;
    box-shadow: none;
    border-width: 2px;
    border-radius: 0 2px 2px 0;
}

.form-control[readonly] {
    cursor: pointer;
}

.form-control[readonly]:focus {
    padding: 7px 11px 6px 9px;
    border-radius: 2px;
    box-shadow: none;
}

.form-control[data-api-token] {
    font-size: 16px;
    height: 42px;
    padding: 5px 11px 7px 9px;
}

input:focus:invalid:focus, textarea:focus:invalid:focus, select:focus:invalid:focus {
    box-shadow: none;
}

.input-group {
    display: inline;
}

.input-group .input-group-addon {
    float: left;
    min-height: 22px;
    width: 10%;
    line-height: 20px;
    padding: 6px 0;
    margin: 0 -4px 6px 0;
    padding-bottom: 7px;
    border-right: 0;
    background: none;
    color: #c6cacd;
    font-size: 16px;
}

.input-group .form-control {
    width: 90%;
    float: right;
    margin: 0 0 6px;
}

.api-token-group {
    display: block;
    margin-bottom: 5px;
}
.api-token-group .api-token {
  width: 85%;
  right: 0;
  text-align: center;
}
.api-token-group .btn-show-api-token {
  width: 185px;
  position: absolute;
  z-index: 10;
}

.input-group input.input-lg ~ .input-group-addon {
    line-height: 32px;
    font-size: 20px;
}

.input-group .input-group-addon-button {
    padding: 0;
}

.input-group .input-group-addon .btn {
    padding: 6px 20px;
    border-width: 0 0 2px;
}

.input-group input:focus ~ .input-group-addon {
    padding-top: 5px;
    padding-bottom: 5px;
    border: 2px solid rgba(82, 168, 236, 0.8);
    border-right: 0;
    border-radius: 2px 0 0 2px;
}

.input-group input:focus ~ .input-group-addon span {
    margin-left: -1px;
    color: rgb(82, 168, 236);
}

.packages {
    margin-top: 20px;
}

.packages h1 {
  font-family: Verdana;
  font-size: 22px;
  line-height: 1em;
  font-weight: normal;
  margin: 0;
  padding: 8px 4px 0 0;
  height: 32px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.packages .metadata {
  color: #555;
  font-size: 15px;
}
.packages .metadata .glyphicon {
  top: 3px;
  margin: 0 1px;
  font-size: 18px;
}
.packages .metadata-block {
  display: block;
  margin-bottom: 10px;
}
.packages .metadata-block:last-child {
  margin-bottom: 0;
}

.input-group input:focus:invalid:focus {
    border-color: #fa3a15;
}

.input-group input:focus:invalid:focus ~ .input-group-addon {
    border-color: #fa3a15;
}

.input-group input:focus:invalid:focus ~ .input-group-addon span {
    color: #fa3a15;
}

.input-group input, .input-group select {
    border-left: 0;
}

.input-group-addon:last-child, .input-group .btn:last-child {
    border-radius: 2px 0 0 2px;
}

.input-group .form-control:first-child, .input-group-addon:first-child {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.input-group-addon:last-child {
    border-left: 1px solid;
    border-right: 0;
}

.nav-tabs {
    border: 0;
}

.nav-tabs li a {
    padding: 11px 20px;
    background: #fff;
    color: #515966;
    font-weight: 600;
    border-radius: 0;
}

.nav-tabs li:first-child a {
    border-radius: 4px 4px 0 0;
}

.nav-tabs li:last-child a {
    border-radius: 0 0 4px 4px;
}

.nav-tabs li.active a, .nav-tabs.nav-stacked > li > a:hover {
    background: #f28d1a;
    color: #fff;
}

.nav-tabs.nav-stacked > li > a, .nav-tabs.nav-stacked > li > a:hover {
    border: 0;
}

.nav-tabs.nav-stacked > li > a:hover {
    background: #f28d1a;
}

.nav-tabs.nav-stacked [class^="icon-"], .nav-tabs.nav-stacked [class*=" icon-"] {
    float: right;
    font-size: 20px;
    margin-top: -2px;
}

.nav-stacked>li+li {
  margin-top: 0;
}
.nav-tabs>li{
  margin-bottom: 0;
}

.btn {
    padding: 9px 20px;
    box-shadow: none;
    border: 0;
    border-bottom: 4px solid;
    border-radius: 3px;
    text-shadow: none;
    font-weight: 600;
}
.btn-group-xs .btn {
    padding: 5px 10px;
    font-size: 12px;
}

.btn.loading, .btn.loading:hover, .btn.loading:active {
    background-image: url("../web/img/loader.gif");
    background-position: 95% 50%;
    background-repeat: no-repeat;
}

.btn-default {
    background: #bbbfc4;
    border-bottom-color: #a5aab0;
    color: #fff;
    font-size: 14px;
}
.btn-default:focus, .btn-default:active {
  color: #fff;
  background: #a5aab0;
  border-bottom-color: #bbbfc4;
}

.btn.disabled {
    border-bottom-color: #e1e1e8;
}

.btn:hover {
    background: #bbbfc4;
    color: #fff;
}

.btn.disabled:hover {
    background: #e6e6e6;
    color: #333;
}

.btn-danger, .btn-danger:hover {
    background: #ff4533;
    border-bottom-color: #cd3729;
}
.btn-danger:focus, .btn-danger:active {
    background: #cd3729;
    border-bottom-color: #ff4533;
}

.btn-inverse, .btn-inverse:hover {
    color: #fff;
    background: #454e5c;
    border-bottom-color: #303339;
}
.btn-inverse:focus, .btn-inverse:active {
    color: #fff;
    background: #303339;
    border-bottom-color: #454e5c;
}

.btn-primary, .btn-primary:hover {
  background: #3594e2;
  border-bottom-color: #2f6cca;
}
.btn-primary:focus, .btn-primary:active {
  background: #2f6cca;
  border-bottom-color: #3594e2;
}

.btn-success, .btn-success:hover {
    background: #83c129;
    border-bottom-color: #69ad21;
}
.btn-success:focus, .btn-success:active {
    background: #69ad21;
    border-bottom-color: #83c129;
}

.btn-warning, .btn-warning:hover {
    background: #ed9e2e;
    border-bottom-color: #F28D1A;
}
.btn-warning:focus, .btn-warning:active {
    background: #F28D1A;
    border-bottom-color: #ed9e2e;
}

.btn-github {
    line-height: 26px;
    font-weight: 600;
    color: #fff;
    text-align: center;
}

.btn-github span {
    margin: 0 15px 0 0;
    vertical-align: text-top;
    font-size: 22px;
}

/* Search */
#search_query_query {
  display: inline;
}

.wrapper-search {
  clear: both;
}
.wrapper-search .sortable a {
  border: 0;
}

#search_query_orderBys {
  display: none;
}

.sortable .glyphicon.active {
  color: #2d2d32;
}

.sortable #order-bys-wrapper {
  font-size: 24px;
  position: relative;
  top: 2px;
  margin-left: -12px;
  padding-right: 0;
  white-space: nowrap;
  overflow: hidden;
  height: 30px;
}

.sortable .order-by-group .icon:first-child {
  margin-right: 5px;
}

.sortable #order-bys-wrapper a {
  margin-right: 7px;
  display: inline-block;
}

.sortable #order-bys-wrapper a.clear {
  width: auto;
  margin-right: 0px;
  margin-left: 5px;
}

#search-form .submit-wrapper {
  width: 100px;
  float: right;
  display: none;
}
.no-js #search-form .submit-wrapper {
  display: block;
}
#search-form .submit {
  margin: 0;
  padding: 6px 20px;
  width: 100px;
}
#search-form p {
  margin: 0;
}
.search-list {
  margin-top: 10px;
}


.package h2.title {
    margin-bottom: -1px !important;
    position: relative;
}
.package .force-update-trigger {
    cursor: pointer;
}
.package .force-update-trigger.loading:after {
    content: "";
    background-position: 7px center;
    background-image: url("../web/img/loader-white.gif");
    background-repeat: no-repeat;
    padding-left: 30px;
}
.package .action input.loading, .package .action input.loading:hover, .package .action input.loading:active {
  background-position: 10px center;
  background-image: url("../web/img/loader.gif");
  background-repeat: no-repeat;
  padding-left: 35px;
}
.package .action {
  margin-right: 5px;
  margin-bottom: 15px;
  display: inline-block;
}
.package, .package p {
    font-size: 14px;
}

.package p.description {
    margin-top: 0;
    font-size: 25px;
    font-style: italic;
    font-weight: 300;
    margin-bottom: 15px;
}
@media (max-width: 767px) {
    .package p.description {
        font-size: 20px;
    }
}
.package .details {
    line-height: 200%;
}
.package .details p > i:first-child {
    margin-right: 5px;
}
.package .details p, .package .facts p {
    margin: 0;
}
.package .details .maintainers {
  padding-bottom: 6px;
  font-size: 0.0001px;
}
.package .details .maintainers img {
  margin-bottom: 4px;
  margin-right: 4px;
}
.package .details #add-maintainer {
  margin-top: 3px;
  margin-bottom: 7px;
  float: right;
  font-size: 34px;
}
.package .details #remove-maintainer {
  float: right;
  font-size: 35px;
  margin-top: 5px;
}
.package .details .canonical,
.package .funding p {
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
}

.package .facts {
    margin-top: 10px;
}
@media (max-width: 991px) and (min-width: 768px) {
    .package .facts {
        margin-top: 0;
    }
}
.package .facts span {
    display: inline-block;
    width: 100px;
}

.package .tags a:before {
  content: "#";
}
.package .tags a {
  margin-right: 10px;
  display: inline-block;
}

.package-header .filters {
    font-size: .5em;
    float: right;
    background: #fafafa;
    padding: 5px 10px;
    border: 1px solid #f28d1a;
    line-height: 24px;
}
.package-header .filters .filter {
    display: block;
}
.package-header .filters .active {
    text-decoration: underline;
}

.btn-github.disabled {
    background: #ecf0f1;
    color: #bdc3c7;
}



.package .readme {
  padding-bottom: 20px;
}
.wrapper .content .package .readme img {
  max-width: 100%;
}
.wrapper .content .package .readme h1:first-child,
.wrapper .content .package .readme p:first-child,
.wrapper .content .package .readme h2:first-child,
.wrapper .content .package .readme h3:first-child {
  margin-top: 0;
}
.wrapper .content .package .readme h1 {
  font-size: 20px;
  font-weight: 300;
  padding: 0;
  margin: 25px 0 10px;
  line-height: 100%;
}
.wrapper .content .package .readme h2 {
  font-size: 16px;
  font-weight: 600;
  padding: 0;
  margin: 25px 0 10px;
  line-height: 100%;
}
.wrapper .content .package .readme h3,
.wrapper .content .package .readme h4,
.wrapper .content .package .readme h5,
.wrapper .content .package .readme h6 {
  font-size: 14px;
  font-weight: 600;
  padding: 0;
  margin: 15px 0 5px;
  line-height: 100%;
}

.wrapper .content .package .readme table {
  margin: 0 0 15px;
}
.wrapper .content .package .readme th,
.wrapper .content .package .readme td {
  border: 1px solid #CCC;
  padding: 5px 10px;
}
.wrapper .content .package .readme th {
  background: #EEE;
}
.wrapper .content .package .readme table code {
  font-size: 13px;
}

.package .package-aside {
  border-top: 1px solid #f28d1a;
  border-radius: 0;

  margin: 0;
  padding: 20px 0 0;
}
.package .package-aside.versions-wrapper {
  margin-left: 15px;
  margin-right: 15px;
}
.package-aside .details {
  padding-left: 0;
}
.package .package-aside i {
  color: #bbbfc4;
}
.package .package-aside i:hover {
  color: #a5aab0;
}
.package .package-aside .facts i, .package .package-aside .facts i:hover {
  color: #2d2d32;
  margin-right: 4px;
}
.package .package-aside a.advisory-alert {
    margin-left: -20px;
}
.package .package-aside a.advisory-alert:hover, .package .package-aside a.advisory-alert:active {
    text-decoration: none;
}
.package .package-aside a.advisory-alert i {
    color: #ff4533;
}
.package .package-aside a.advisory-alert:hover i {
    color: #cd3729;
}

.package .details-toggler.open, .package .details-toggler.open a, .package .details-toggler.open i {
  background: #f28d1a;
  color: #fff;
}

.package .package-aside.versions-wrapper, .package .version-details {
  margin-top: 20px;
}
.package .last-update {
    padding: 15px;
}
.package .last-update p, .package .last-update a {
    font-size: 10px;
}
.package .last-update .auto-update-success {
    color: #69AD21;
}
.package .last-update .auto-update-danger {
    color: #ff002f;
}

.package .version-details .title {
  border-top: 1px solid #f28d1a;
  padding-top: 10px;
}
.package .versions {
  list-style: none;
  line-height: 170%;
  overflow-y: hidden;
  max-height: 300px;
  padding: 0;
  margin: 0;
}
.package .versions-expander {
  text-align: center;
  cursor: pointer;
  margin: 10px 0 0;
  line-height: 25px;
}
.package .versions .version {
  padding: 2px 0 2px 5px;
}
.package .versions .version-number {
  display: block;
  float: left;
  width: 91%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.package .details-toggler {
  cursor: pointer;
}

.package .versions .version {
  position: relative;
  display: block;
  height: 26px;
}
.package .delete-version {
  display: inline-block;
}
.package .delete-version .submit {
  position: absolute;
  right: 5px;
  top: 7px;
}
.package .delete-version .submit:hover {
  color: #cd3729;
}

@media (min-width: 992px) {
    .search-facets .ais-menu--count {
        float: right;
    }

    .package-aside .details {
      padding-left: 15px;
    }
    .package .package-aside {
      background: #fff;
      border-radius: 2px;
      border-top: 0;
      padding: 10px 0;
      margin-left: -15px;
      margin-right: -15px;
    }
    .package .package-aside.versions-wrapper {
      margin-left: 0;
      margin-right: 0;
      padding: 15px;
    }
    .package .versions {
      margin: 0 -15px;
    }
    .package .versions .version {
      padding: 2px 15px 2px 15px;
    }
    .package .delete-version .submit {
      right: 15px;
    }
}
@media (max-width: 767px) {
  .package-aside .facts {
    padding-left: 0;
  }
  .wrapper-footer {
    font-size: 12px;
  }
  .wrapper-footer a {
    white-space: nowrap;
  }
}

.package .version-details .version-number {
  font-size: 16px;
  font-weight: 600;
  color: #2d2d32;
}
.version-details.loading .title .version-number:after {
  display: inline-block;
  content: "";
  width: 16px;
  height: 16px;
  background-image: url("../web/img/loader-white.gif");
  background-repeat: no-repeat;
  position: relative;
  top: 2px;
  left: 10px;
}
.package .version-details .release-date {
  float: right;
  position: relative;
  top: 3px;
  font-size: 12px;
}
.package .version-details .link-type {
    font-weight: 600;
    text-transform: lowercase;
}
.package i {
    color: #2d2d32;
}
.package .version-details .source-reference {
    margin-left: 10px;
    display: inline-block;
}
.package .version-details .license {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.package .version-details .license .unknown, .abandoned i {
  color: #c00;
}
.package .version-details .authors {
  list-style: none;
  display: inline;
  margin: 0;
  padding: 0;
}
.package .version-details .authors li {
  display: inline;
  margin-right: 5px;
}
.package .version-details .authors li:after {
  content: ", ";
}
.package .version-details .authors li:last-child:after {
  content: "";
}
.package .version-details .package-links {
  border-top: 1px solid #f28d1a;
  border-bottom: 1px solid #f28d1a;
  margin-top: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.package .version-details .package-links ul  {
    padding-left: 18px;
    word-break: break-word;
}
.package .version-details .package-links .no-links {
    color: #999;
}
.package .version-details .pie-metadata {
  border-top: 1px solid #f28d1a;
}

.package .requireme {
    margin-top: 15px;
}
.package .requireme input {
  cursor: text;
  border: 0 !important;
  border-radius: 0;
  background-color: transparent;
  font-family: Consolas, "Courier New", Courier, monospace;
  min-width: 80%;
  position: relative;
  top: -3px;
  left: 2px;
}


.package .mark-favorite {
  font-size: 20px;
  cursor: pointer;
  color: #BDC3C7;
  position: absolute;
  left: -25px;
  top: 15px;
}
.package .mark-favorite.is-starred {
  color: #F28D1A;
}
@media (max-width: 767px) {
    .package .mark-favorite {
      left: auto;
      right: 0;
    }
}

#powered-by {
    float: right;
    width: 160px;
    text-align: right;
    padding-top: 16px;
}
#powered-by a img {
    width: 77px;
}

#pagination-container {
    text-align: center;
    margin-bottom: 32px;
}

.pagination {
    margin: 6px 0;
}

.pagination ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.pagination ul > li {
    float: left;
    line-height: 40px;
    padding: 0;
}

.pagination ul > li > a, .pagination ul > li > span {
    font-size: 14px;
    font-weight: 600;
    height: 40px;
    text-align: center;
    text-decoration: none;
    padding: 0 10px;
    display: inline-block;
}
.pagination ul > li > a:hover, .pagination .ais-pagination--item__active {
    background: #F2F2F2;
}
.pagination .ais-pagination--item__active a {
    color: #000 !important;
}

.legend {
  font-size: .8em;
  margin-bottom: 10px;
  text-align: center;
}
.legend li {
  display: inline;
  padding: 0 10px;
}
.legend span {
  font-size: 1.5em;
}
.legend-first {
  color: #f28d1a;
}
.legend-second {
  color: #2d2d32;
}

.wrapper .content h2.title, .wrapper .content h3.title {
    margin: -5px 0 15px;
    padding: 0 0 15px;
    border-bottom: 1px solid #f28d1a;
    color: #2d2d32;
    clear: left;
}

.wrapper .content h3.title {
    padding: 0 0 15px;
    font-size: 40px;
    line-height: 45px;
}
.content h3.profile-title {
    margin-top: 0;
    margin-bottom: 20px;
}

.wrapper .content h2 {
    font-size: 36px;
    line-height: 44px;
    padding-bottom: 18px;
    padding-right: 20px;
}

.wrapper .content h2 small {
    margin-left: 10px;
    vertical-align: middle;
}

.wrapper .content h2.title a {
    color: #2d2d32;
    font-weight: 600;
    text-decoration: none;
}

h2.title .php-ext-link {
    float: right;
    margin-top: 16px;
}

@media (max-width: 767px) {
    .wrapper .content h2.title {
        font-size: 26px;
        padding-bottom: 5px;
    }
}

.wrapper .content .header-menu-item {
    margin-left: 1.5em;
}
.wrapper .content .header-menu-item.active {
    font-weight: normal;
    text-decoration: underline;
}

.wrapper .content p {
    line-height: 150%;
    vertical-align: baseline;
}


.font-slim {
    font-weight: 300;
}

.font-normal {
    font-weight: 400;
}

.font-bold {
    font-weight: 500;
}

.font-fat {
    font-weight: 600;
}

.text-center {
    text-align: center;
}


.col-lg-6 .input-group input {
    width: 89%;
}

.col-lg-6 .input-group .input-group-addon {
    margin-right: -5px;
    width: 8%;
}


#submit-package-form .form-control {
    border-radius: 4px;
}


.edit_profile .failure-notifications {
    margin: 10px 0;
    float: left;
}


.packages-short ul {
    list-style: none;
    margin: 0;
}

.packages-short li {
    margin-bottom: 12px;
    font-style: italic;
    font-weight: 400;
}

.packages-short li a {
    display: block;
    font-style: normal;
}

.packages-short li a strong {
    margin-left: 5px;
    font-size: 14px;
}

.packages .package-item {
    padding: 5px 15px;
    margin-bottom: 10px;
    background: #fff;
    border-radius: 4px;
}

.packages .selected .package-item {
    padding: 4px 14px;
    border: 1px solid #F28D1A;
}

.packages .package-item h4 {
    font-size: 20px;
    margin-bottom: 0;
}

.packages .package-item h4 small {
    margin-left: 5px;
    color: #83C129;
    font-size: 16px;
}

.alert {
    border-left: 4px solid #000;
    box-shadow: none;
    border-radius: 0;
    padding: 5px 0 5px 10px;
}
.flash-container .alert {
    margin-bottom: 5px;
}
.flash-container .alert:last-child {
    margin-bottom: 0;
}
.alert p {
  margin: 0;
}
.alert-warning {
    border-left-color: #F28D1A;
    color: #2d2d32;
    background-image: linear-gradient(to bottom,#fcf8e3 0,#f8efc0 100%);
}
.alert-warning::before {
    content: "Warning: ";
    float: left;
    padding-right: 5px;
}
.alert-danger, .alert-error {
    border-left-color: #cd3729;
    color: #2d2d32;
    background-image: linear-gradient(to bottom,#f2dede 0,#e7c3c3 100%);
}
.alert-error::before {
    content: "Error: ";
    float: left;
    padding-right: 5px;
}
.alert-success {
    border-left-color: #69AD21;
    color: #2d2d32;
    background-image: linear-gradient(to bottom,#dff0d8 0,#c8e5bc 100%);
}


svg {
    display: auto !important;
    width: auto !important;
    height: auto !important;
}

@media (max-width: 1199px) {
    .publishing-packages {
        margin-top: 40px;
    }
}
#how-to-submit-packages, #how-to-update-packages {
    margin-top: 40px;
}

.two-factor-key {
    max-width: 200px;
    text-align: center;
    overflow-wrap: break-word;
}
.two-factor-backup-code {
    font-size: 3em;
}

html,
body {
  min-height: 100%;
}
.notifications {
    position: fixed;
    transition: all 0.6s ease-in-out;
    z-index: 100000;
    letter-spacing: -1px;
    top: 20px;
    left: 30%;
    opacity: 0;
    width: 40%;
    max-height: 500px;
    color: #333;
    padding: 10px;
    text-align: center;
    background-color: #fafafa;
    border-radius: 2px;
    text-shadow: 0 1px 1px rgba(255,255,255,0.8);
    box-shadow: 0 1px 2px rgba(0,0,0,0.5);
    transform: translateY(-100px);
    overflow: auto;
}
.notifications.visible {
    opacity: 100%;
    transform: translateY(0);
}
.notification .title {
    font-size: 18px;
}
.notification .content {
    margin-top: 10px;
}
.notifications pre {
    background: #2d2d32;
    color: #fff;
    text-shadow: none;
    text-align: left;
}
@media (max-width: 992px) {
    .notifications {
        left: 10%;
        width: 80%;
    }
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
    font-family: 'fontello';
    font-style: normal;
    font-weight: normal;
    font-size: 110%;

    display: inline-block;
    width: 1em;

    line-height: 1;
    text-decoration: inherit;
    text-align: center;
    speak: none;
}

.sponsor {
    p {
        margin-bottom: 0;
    }
    img {
        height: 45px;
        position: relative;
        top: -3px;
    }
}

.icon-check:before { content: '\2611'; } /* '☑' */
.icon-tools:before { content: '\2692'; } /* '⚒' */
.icon-cogs:before { content: '\26ef'; } /* '⛯' */
.icon-mail:before { content: '\2709'; } /* '✉' */
.icon-user-add:before { content: '\e700'; } /* '' */
.icon-vcard:before { content: '\e722'; } /* '' */
.icon-archive:before { content: '\e738'; } /* '' */
.icon-share:before { content: '\e73c'; } /* '' */
.icon-back-in-time:before { content: '\e771'; } /* '' */
.icon-off:before { content: '\e78e'; } /* '' */
.icon-flow-tree:before { content: '\e792'; } /* '' */
.icon-paper-plane:before { content: '\e79b'; } /* '' */
.icon-traffic-cone:before { content: '\e7a3'; } /* '' */
.icon-github:before { content: '\f09b'; } /* '' */
.icon-lightbulb:before { content: '\f0eb'; } /* '' */
.icon-twitter:before { content: '\f309'; } /* '' */
.icon-box:before { content: '\f330'; } /* '' */
.icon-leaf:before { content: '🍂'; } /* '\1f342' */
.icon-user:before { content: '👤'; } /* '\1f464' */
.icon-users:before { content: '👥'; } /* '\1f465' */
.icon-folder:before { content: '📁'; } /* '\1f4c1' */
.icon-chart:before { content: '📈'; } /* '\1f4c8' */
.icon-megaphone:before { content: '📣'; } /* '\1f4e3' */
.icon-newspaper:before { content: '📰'; } /* '\1f4f0' */
.icon-mobile:before { content: '📱'; } /* '\1f4f1' */
.icon-key:before { content: '🔑'; } /* '\1f511' */
.icon-lock:before { content: '🔒'; } /* '\1f512' */
.icon-lock-open:before { content: '🔓'; } /* '\1f513' */
.icon-rocket:before { content: '🚀'; } /* '\1f680' */

// API Documentation badges
.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    border-radius: 10px;
    margin-left: 8px;

    &.bg-success {
        background-color: #83c129;
    }
    &.bg-warning {
        background-color: #ed9e2e;
    }
}
