/*!
 * aggregit.css
 *
 * Copyright 2015 Timothy Davenport; Licensed MIT
 */

/* General Styles
 ---------------------- */
html {
    position: relative;
    min-height: 100%;
    overflow-x: hidden;
}
body {
    margin-top: 48px;
    margin-bottom: 48px;
    overflow-x: hidden;
}
nav {
    animation: introDn 512ms ease 0s 1 both;
}
footer {
    animation: introUp 1024ms ease 0s 1 both;
}
.bringIn {
    animation: introOut 256ms ease 0s 1 both;
}
@keyframes introDn {
    0%   {opacity: 0; transform: scale(1.02) translateY(-64px);}
    100% {opacity: 1; transform: scale(1) translateY(  0px);}
}
@keyframes introDn2 {
    0%   {opacity: 0; transform: scale(1.05) translateY(-48px);}
    100% {opacity: 1; transform: scale(1) translateY(  0px);}
}
@keyframes introUp {
    0%   {opacity: 0; transform: scale(0.98) translateY(32px);}
    100% {opacity: 1; transform: scale(1) translateY( 0px);}
}
@keyframes introOut {
    0%   {opacity: 0; transform: scale(0.95) translateY(10px);}
    100% {opacity: 1; transform: scale(1) translateY( 0px);}
}
nav {
    margin-bottom: 0;
}
mark code {
    background-color: #fff8eb;
}

.footnote ol {
    margin: 0px;
}
ul {
    padding-start:20px;
}
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 48px;
}
footer hr {
    margin: 5px;
}
footer p {
    margin: 0 auto;
    padding-bottom:  0;
}
footer a::before {
    margin-top:-24px!important;
}
.no-touch footer a:hover::before {
    margin-top:-64px!important;
}
.container-fluid {
    padding: 0;
}
.abbr[title] {
    border-bottom: 2px dotted black!important;
}
.checklist {
    list-style: none;
}
input[type="checkbox"]::after,
.checkbox input[type="checkbox"]::after,
.checkbox-inline input[type="checkbox"]::after {
    content: "x";
    line-height: 0.8;
    color: #eee;
    font-size: 16px;
    padding-left: 3px;
}
input[type="checkbox"]:checked::after,
.checkbox input[type="checkbox"]:checked::after,
.checkbox-inline input[type="checkbox"]:checked::after {
    content: "x";
}
input[type="checkbox"]:checked::before,
.checkbox input[type="checkbox"]:checked::before,
.checkbox-inline input[type="checkbox"]:checked::before {
    display: none;
}

.no-touch .force-hover[title]::before,
.no-touch abbr[title]::before,
.no-touch a[href]:not(.no-hover)::before,
.no-touch time[datetime]:not(.no-hover)::before {
    position: absolute;
    margin-top:0px;
    padding: 4px;
    background-color: #30c2a4;
    color:#fdfefd;
    text-align: center;
    white-space: pre;
    word-break: break-all!important;
    opacity: 0;
    transition: all 0.5s ease;
    z-index: 2000;
    pointer-events: none;
}
.no-touch .pull-right .force-hover[title]::before,
.no-touch .pull-right abbr[title]::before,
.no-touch .pull-right a[href]:not(.no-hover)::before,
.no-touch .pull-right time[datetime]:not(.no-hover)::before {
    right: 2px;
}
.no-touch .pull-left .force-hover[title]::before,
.no-touch .pull-left abbr[title]::before,
.no-touch .pull-left a[href]:not(.no-hover)::before,
.no-touch .pull-left time[datetime]:not(.no-hover)::before {
    left: 4px;
}
.no-touch .navbar-right .force-hover[title]::before,
.no-touch .navbar-right abbr[title]::before,
.no-touch .navbar-right a[href]:not(.no-hover)::before,
.no-touch .navbar-right time[datetime]:not(.no-hover)::before {
    right: 2px;
}

.no-touch time[datetime]:not(.no-hover)::before {
    background-color: #24af92;
}
abbr[title]::before {
    background-color: #1a9d82;
}
.no-touch .force-hover[title]::before,
.no-touch abbr[title]::before {
    content: attr(title);
}
.no-touch a[href]:not(.no-hover)::before {
    content: attr(href) "\a(" attr(alt) ")";
}
.no-touch time[datetime]:not(.no-hover)::before {
    content: "ISO8601 : " attr(datetime);
}
.no-touch .force-hover[title]:hover::before,
.no-touch abbr[title]:hover::before,
.no-touch a[href]:not(.no-hover):hover::before,
.no-touch time[datetime]:not(.no-hover):hover::before {
    opacity: 1;
    margin-top:-48px;
}
.no-touch a[href]:not(.no-hover):hover::before {
    margin-top:-64px;
}
.no-touch nav .force-hover[title]:hover::before,
.no-touch nav abbr[title]:hover::before,
.no-touch nav a[href]:not(.no-hover):hover::before,
.no-touch nav time[datetime]:not(.no-hover):hover::before {
    opacity: 1;
    margin-top:48px;
}
.tooltip {
    position: absolute;
    margin-top:-16px;
    padding: 4px;
    background-color: #30c2a4;
    color:#fdfefd;
    transition: all 0.5s ease;
    z-index: 2000;
    pointer-events: none;
}
.progress {
    height: 21px;
}
/* Weird fix to stop div:before from being displayed from bootstrap */
.progress-bar:last-child::before {
    content: '';
}
#help-arrow {
    position: absolute;
    top:-28px;
    left:80px;
    font-size: 500%;
    animation: introUp 1024ms ease 0s 1 both;
}
#help-arrow i {
    color:#b2dbfb;
    animation: pulsecolor 600ms ease 300ms infinite alternate;
}
.input-group-addon.help-pulse {
    animation: pulsecolor 600ms ease 0s infinite alternate;
}
.form-control.help-pulse {
    animation: pulseborder 600ms ease 300ms infinite alternate;
}
@keyframes pulsecolor {
    0%   {color:#b2dbfb;}
    100% {color:#ff9800;}
}
@keyframes pulseborder {
    0%   {box-shadow: inset 0 -2px 0 #b2dbfb;}
    100% {box-shadow: inset 0 -2px 0 #ff9800;}
}

/* Bootstrap overrides */
body {
    font-size: 12px;
}
h1,
.h1 {
  font-size: 45px;
}
h2,
.h2 {
  font-size: 36px;
}
h3,
.h3 {
  font-size: 27px;
}
h4,
.h4 {
  font-size: 19px;
}
h5,
.h5 {
  font-size: 16px;
}
h6,
.h6 {
  font-size: 11px;
}
.input-group-addon {
    font-size: 10px;
}
textarea, textarea.form-control, input.form-control, input[type=text], input[type=password], input[type=email], input[type=number], [type=text].form-control, [type=password].form-control, [type=email].form-control, [type=tel].form-control, [contenteditable].form-control {
    font-size: 13px;
}
@media (min-width: 600px) {
    body {
        font-size: 14px;
    }
    h1,
    .h1 {
      font-size: 56px;
    }
    h2,
    .h2 {
      font-size: 45px;
    }
    h3,
    .h3 {
      font-size: 34px;
    }
    h4,
    .h4 {
      font-size: 24px;
    }
    h5,
    .h5 {
      font-size: 20px;
    }
    h6,
    .h6 {
      font-size: 14px;
    }
    .input-group-addon {
        font-size: 13px;
    }
    textarea, textarea.form-control, input.form-control, input[type=text], input[type=password], input[type=email], input[type=number], [type=text].form-control, [type=password].form-control, [type=email].form-control, [type=tel].form-control, [contenteditable].form-control{
        font-size: 16px;
    }
}

/* Home Page Styles
 ---------------------- */
#home-jumbo,
.jumbotron {
    padding: 16px!important;
    margin-bottom: 16px!important;
}
#home-jumbo .lead {
    margin-bottom: 8px;
    font-size: 16px;
}
#home-logo {
    width: 50%!important;
}
#home h3 small {
    font-size: 50%;
}
#home h3,
#home .well {
    margin: 4px 0px;
}

@media (min-width: 600px) {
    #home-logo {
        width: 20%!important;
    }
    #home h3 small {
        font-size: 65%;
    }
    #home-jumbo .lead {
        font-size: 20px;
    }
}

/* About Page Styles
 ---------------------- */
#about h1,
#about h2,
#about h3,
#about h4,
#about h5,
#about h6 {
    margin: 8px 0px;
}
#about hr {
    margin: 16px 0px;
}
#about .lead {
    margin-bottom: 16px;
}

/* Panel Page Styles
 ---------------------- */
#json-file {
    margin-bottom: 16px;
    text-shadow: 3px 3px #bbbbbb;
}
#auth-logo {
    width: 40%!important;
    margin-bottom: 8px;
}
#auth-panel,
#export-panel {
    width: 80%;
    margin-bottom: 0px;
}
@media (min-width: 600px) {
    #auth-panel,
    #export-panel {
        width: 55%;
    }
}
#auth-panel .smallprint {
    margin-top: 16px;
}
.smallprint {
    font-size: 13px !important;
    line-height: 1.5;
}
#safari-warning {
    margin-top: 16px;
    background-color: #ffe0b2!important;
    border-color: #ffc599!important;
    color:#333!important;
}

/* Cursors patterns */
.authed {
   cursor: not-allowed;
}
.authed:active {
    pointer-events: none;
}

/* aggregiting spinner */
#aggregiting {
    font-size: 500%;
}

/* Navbar
 ---------------------- */
.navbar {
    background-color: rgba(12, 132, 228, 0.96);
}
.navbar .input-group-addon a,
.navbar .input-group-addon {
    color:#b2dbfb;
}
#cached-user,
#export-user {
    position: relative;
}
#cached-user {
    z-index: 1000;
    animation: fadeInDn 1000ms ease 100ms 1 both;
}
#export-user {
    z-index: 1000;
    animation: fadeInDn 1000ms ease 200ms 1 both;
}
@keyframes fadeInDn {
    0%   {opacity: 0; transform: translateY(-32px);}
    100% {opacity: 1; transform: translateY(0px);}
}
.no-touch .navbar .input-group-addon a:hover {
    color:#fff;
}
#beta {
    position: absolute;
    top:0;
    left:0;
    transform-origin: 50% 50%;
    animation: slidein 1000ms ease 200ms 1 both;
}
@keyframes slidein {
    0%   {opacity: 0; transform: rotate(23deg) scale(2) translate(8px, 0px);}
    100% {opacity: 1; transform: rotate(-23deg) scale(1) translate(8px, 12px);}
}

nav #nav-search-user.form-control {
    width:45px!important;
}
@media (min-width: 350px) {
    nav #nav-search-user.form-control {
        width:95px!important;
        font-size: 12px!important;
    }
}
@media (min-width: 400px) {
    nav #nav-search-user.form-control {
        width:130px!important;
        font-size: 14px!important;
    }
}
@media (min-width: 600px) {
    nav #nav-search-user.form-control {
        width:150px!important;
        font-size: 16px!important;
    }
}

#nav-logo {
    width: 48px;
}

/* No Collapse Navbar
 ---------------------- */
 .navbar .container {
    padding-left: 4px;
    padding-right: 4px;
 }
.navbar-header {
    float:left!important;
    margin-right: 0px!important;
    margin-left: 0px!important;
}
.navbar-brand {
    margin-left:0px!important;
    padding: 4px 2px;
}
.navbar-nav.navbar-left {
    float: left!important;
    margin: 0;
}
.navbar-nav.navbar-right {
    float: right!important;
    margin: 0;
}
.navbar-nav>li {
    float:left!important;
}
.navbar-nav>li>a {
    padding: 10px 2px;
    height: 48px;
}
.navbar-form.navbar-left {
    float:left!important
}
.navbar-form.navbar-right {
    float:right!important
}
.navbar-form {
    width: auto!important;
    height: 48px!important;
    border: 0!important;
    margin: 0px!important;
    padding: 0!important;
    box-shadow: none!important;
}
.navbar-form .input-group {
    padding: 4px 1px;
    display: inline-table!important;
    vertical-align: middle!important;
}
.navbar-form .input-group .input-group-addon,
.navbar-form .input-group .input-group-btn,
.navbar-form .input-group .form-control {
    width: auto!important;
}
.navbar-form .form-control {
    display: inline-block!important;
    width: auto!important;
    vertical-align: middle!important;
}
.navbar-form .input-group-addon {
    padding-left: 2px!important;
    padding-right: 2px!important;
}

/* User Info
 ---------------------- */
#user-info .media,
#user-info .media-body {
    overflow: visible;
}
#avatar {
    width: 64px;
    height: 64px;
    padding: 1px;
    border: 1px solid #ddd;
}
@media (min-width: 600px) {
    #avatar {
        width: 128px;
        height: 128px;
        padding: 4px;
    }
}
#follower-list,
#repogist-list,
#badge-list {
    display: inline-block;
    padding-left: 16px;
}
#hireable {
    color: #4CAF50;
}
#site_admin {
    color: #9C27B0;
}
#user-info hr {
    margin: 4px;
}
/* User Repo Selector
 ---------------------- */
#user-select-navbar {
    display: none;
}
div[id*="user-select-"] .row {
    margin-right: 0px;
    margin-left: 0px;
}
div[id*="user-select-"] .well {
    margin-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    background-color: #fff;
}
#user-select-navbar #repo-list-navbar {
    margin-bottom: 0px;
}
#user-select-navbar.sticky {
    display: block;
}
#user-select-navbar p {
    margin-bottom: 0px;
}
#user-select-inline {
    display: none;
}
#user-select-inline.show {
    display: block;
}
#user-select-inline {
    margin-top: -16px;
}
#user-select-inline ul {
    margin-bottom: 9px;
}
#user-select-inline hr {
    margin-top: 0px;
    margin-bottom: 2px;
}
div[id*="user-select-"] div[class*="col-xs-"] {
    padding-left: 2px;
    padding-right: 2px;
}
.repo-list li.checkbox {
    margin: 0px!important;

}
div[id*="user-select-"] {
    font-size: 80%;
}
div[id*="user-select-"] li.checkbox {
    padding-right: 1px;
    padding-left: 1px;
}
div[id*="user-select-"] li.checkbox label {
    padding-left: 18px;
}
div[id*="user-select-"] li.checkbox input {
    margin-left: -18px;
}
div[id*="user-select-"] input[type="checkbox"] {
    width:13px;
    height: 13px;
}
div[id*="user-select-"] input[type="checkbox"]::after,
div[id*="user-select-"] .checkbox input[type="checkbox"]::after,
div[id*="user-select-"] .checkbox-inline input[type="checkbox"]::after {
    font-size: 13px;
}
div[id*="user-select-"] input[type="checkbox"]:after,
div[id*="user-select-"] .checkbox input[type="checkbox"]:after,
div[id*="user-select-"] .checkbox-inline input[type="checkbox"]:after {
    width: 15px;
    height: 15px;
    border: 1px solid #666666;
}
div[id*="user-select-"] input[type="checkbox"]:checked::after,
div[id*="user-select-"] .checkbox input[type="checkbox"]:checked::after,
div[id*="user-select-"] .checkbox-inline input[type="checkbox"]:checked::after {
    border-color: #2196f3;
}
div[id*="user-select-"] .btn-group-vertical label[class*="btn"] {
    padding: 1px 1px;
    font-size: 8px;
}

div[id*="user-select-"] .btn-group-vertical {
    margin-left: -8px;
}
@media (min-width: 350px) {
    div[id*="user-select-"] .btn-group-vertical {
        margin-left: 0px;
    }
}

@media (min-width: 600px) {
    div[id*="user-select-"] {
        font-size: 100%;
    }
    div[id*="user-select-"] li.checkbox {
        padding-right: 5px;
        padding-left: 5px;
    }
    div[id*="user-select-"] li.checkbox label {
        padding-left: 25px;
    }
    div[id*="user-select-"] li.checkbox input {
        margin-left: -25px;
    }
    div[id*="user-select-"] input[type="checkbox"] {
        width:16px;
        height: 16px;
    }
    div[id*="user-select-"] input[type="checkbox"]::after,
    div[id*="user-select-"] .checkbox input[type="checkbox"]::after,
    div[id*="user-select-"] .checkbox-inline input[type="checkbox"]::after {
        font-size: 16px;
    }
    div[id*="user-select-"] input[type="checkbox"]:after,
    div[id*="user-select-"] .checkbox input[type="checkbox"]:after,
    div[id*="user-select-"] .checkbox-inline input[type="checkbox"]:after {
        width: 18px;
        height: 18px;
        border: 2px solid #666666;
    }
    div[id*="user-select-"] .btn-group-vertical label[class*="btn"] {
        padding: 1px 5px;
        font-size: 12px;
    }
}


/* User Data
 ---------------------- */
#user-data {
    margin-right: 16px;
    margin-left: 16px;
}
.checklist.list-inline li {
    margin-left: 25px;
}
#punchcard svg,
#participation svg,
#languages svg {
    display: block;
    margin: 0 auto;
}
.axis path,
.axis line {
    fill: none;
    stroke: #eee;
    shape-rendering: crispEdges;
}
.axis text {
    font-size: 11px;
}
.aggregitting {
    font-size: 15px;
}

#rate-limit h1 {
    color:#fff!important;
}
#rate-limit {
    animation: slideup 1000ms ease 200ms 1 both;
}
@keyframes slideup {
    0%   {opacity:0; margin-top:100px;}
    100% {opacity:1; margin-top: 0px;}
}

/* User Punch Card
 ---------------------- */
#punchcard .circle {
    fill:#0c84e4;
    transition: fill 256ms ease;
}
.no-touch #punchcard .circle:hover {
    fill:#b2dbfb;
    stroke:#0c84e4;
}

/* User Participation
 ---------------------- */
#participation .line {
    fill: none;
    stroke: :#0c84e4;
    stroke-width: 1.5px;
}
.xlabel,
.ylabel,
.dayLabel,
.monthLabel,
.axis .tick text {
    fill: #909090;
}

/* User HeatMap
 ---------------------- */
.day {
    fill: #eeeeee;
    stroke: #fff;
    transform:translate(0px, 0px);
}
.no-touch .day:hover {
    stroke:#0c84e4;
    transform:translate(-1px, -1px);
}

.xlabel,
.ylabel,
.dayLabel, .monthLabel {
    font-size: 11px;
}

.RdYlGn .q0-8{ fill: #eeeeee;}
.RdYlGn .q1-8{ fill: #c6dbef;}
.RdYlGn .q2-8{ fill: #9ecae1;}
.RdYlGn .q3-8{ fill: #6baed6;}
.RdYlGn .q4-8{ fill: #4292c6;}
.RdYlGn .q5-8{ fill: #2171b5;}
.RdYlGn .q6-8{ fill: #08519c;}
.RdYlGn .q7-8{ fill: #08306b;}

.RdYlGn .q0-8 + text { fill: #08306b;}
.RdYlGn .q1-8 + text { fill: #08519c;}
.RdYlGn .q2-8 + text { fill: #2171b5;}
.RdYlGn .q3-8 + text { fill: #4292c6;}
.RdYlGn .q4-8 + text { fill: #6baed6;}
.RdYlGn .q5-8 + text { fill: #9ecae1;}
.RdYlGn .q6-8 + text { fill: #c6dbef;}
.RdYlGn .q7-8 + text { fill: #eeeeee;}

.legend text {
    font-size: 10px;
}

/* User Languages
 ---------------------- */
#languages .arc path {
  stroke: #fff;
}
#languages-tooltip {
    display: block!important;
    margin: 0 auto!important;
    top:52%;
    left:50%;
    text-align: center;
    background-color: rgba(0,0,0,0)!important;
    color:#30c2a4;
    font-size: 200%;
    transition: all 0.5s ease;
    transform: translate(-50%,-50%);
}
.lang-check {
    margin-left: 0px!important;
}
