<commit_before>/* app css stylesheet */

/**
 * CONTENTS
 *
 * BASE
 * Headings.............H1–H6 styles.
 * Links................Styling for links
 *
 * OBJECTS
 * Wrappers.............Wrapping and constraining elements.
 *
 * COMPONENTS
 * Page-head............The main page header.
 * Banner-top...........The main banner top.
 * Banner-bottom........The main banner bottom.
 * Boxes................Boxes containing details state.
 * State-color..........Colors for changes of states.
 * Decorative lines.....Lines used as decoration on titles & other elements.
 * Icons................Icons elements.
 * Cross close..........Cross Close element.
 * Partial Homepage.....Homepage elements.
 * Partial Details......Details page elements.
 * Partial Infos........Infos page elements.
 *
 * RESPONSIVE
 * Large devices........Responsive ajustments for large devices
 * Medium devices.......Responsive ajustments for medium devices
 * Small devices........Responsive ajustments for small devices
 * Extra small devices..Responsive ajustments for extra-small devices
 *
 * HACKS................Workarounds
 *
 */


/*------------------------------------*\
    #BASE
\*------------------------------------*/

body {
    font-family: 'Open Sans', sans-serif;
    background: url("../img/montreal.jpg") no-repeat center top fixed;
    background-color: black;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: white;
    padding-bottom: 5em;
}

.nav,
.pagination,
.carousel,
.panel-title a { 
    cursor: pointer;
}

.transparent {
    background: black;
    filter: alpha(opacity=50); /* YEAH IE */
    background: rgba(0, 0, 0, 0.50);
}

/** Headings **/
h1, h2, h3, h4, h5 {
    color: #fff;
}
h1 {
    font-size: 2em;
    margin-bottom: 1em;
}
h2 {
    font-size: 1.6em;
}
h2 small {
    margin-left: 0.5em;
}
/** Links **/
a {
    color: #fff;
}
a:active,
a:hover {
    color: rgba(255,255,255,0.8);
}
.link-underline a {
    text-decoration: underline
}
/** Other **/
section {
    margin-bottom: 2em;
}
/*------------------------------------*\
    #COMPONENTS
\*------------------------------------*/

/** Page-head **/
.site-title {
    text-align: center;
    margin-bottom: 1.5em;
}
.site-title a,
.site-title a:hover,
.site-title a:active,
.site-title a:visited {
    color: white;
    text-decoration: none;
}
/** Banner-top **/
.banner {
    padding: 1em;
}

.banner__left {
    font-size: 2em;
    border-right: 1px solid rgba(255, 255, 255, 0.7);
}

/** Banner-bottom **/
.banner-bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 3px 0;
    background-color: #65c178;
}
.banner-bottom a {
    vertical-align: text-top;
}

/** Boxes **/
.box {
    bottom: 17%;
    left: 17%;
    top: 17%;
    right: 17%;
    position: absolute;
    text-align: center;
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.box--round {
    border-radius: 50%;
    border-style: solid;
    border-width: 3px;
}
.box--round:hover {
    border-width: 4px;
    text-decoration: none;
}
.box--round:before,
.box--round::after {
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -moz-box-shadow: 0 2px 10px 0 rgba(0,0,0,.32);
    -webkit-box-shadow: 0 2px 10px 0 rgba(0,0,0,.32);
    box-shadow: 0 2px 10px 0 rgba(0,0,0,.32);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    width: 100%;
}
.box h2 {
    margin-bottom: 0;
    margin-top: 0;
}
.box__inner {
    display: table;
    height: 100%;
    width: 100%;
}
.box__inner_center {
    display: table-cell;
    vertical-align: middle;
}
.box .d-line:before {
    width: 65px;
}
.box:hover .icon--color{
    color: rgba(255, 255, 255, 1);
}
.box:hover .d-line:before {
    background: rgba(255, 255, 255, 1);
}

/***
 * State-color
 * 0: Green (OK)
 * 1: Orange (Warning)
 * 2: Red (Critical)
 * 3: Grey
 *
 * */
/* Green */
.bordercolor_0 { border-color: #65c178; }
.bordercolor_0:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(101,193,120,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(101,193,120,.31);
    box-shadow: 0 8px 17px 0 rgba(101,193,120,.31);
}

.bgcolor_0 { background-color: #65c178; }

.color_0 { color: #65c178; }

/* Orange */
.bordercolor_1 { border-color: #f39c12; }
.bordercolor_1:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(243,156,18,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(243,156,18,.31);
    box-shadow: 0 8px 17px 0 rgba(243,156,18,.31);
}

.bgcolor_1 { background-color: #f39c12; }

.color_1 { color: #f39c12; }

/* Red */
.bordercolor_2 { border-color: #e74c3c; }
.bordercolor_2:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(231,76,60,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(231,76,60,.31);
    box-shadow: 0 8px 17px 0 rgba(231,76,60,.31);
}

.bgcolor_2 { background-color: #e74c3c; }

.color_2 { color: #e74c3c; }


/* Gray */
.bordercolor_3 { border-color: grey; }
.bordercolor_3:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(128,128,128,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(128,128,128,.31);
    box-shadow: 0 8px 17px 0 rgba(128,128,128,.31);
}

.bgcolor_3 { background-color: grey; }

.color_3 { color: grey; }

/** Decorative lines **/
.d-line--after:after, 
.d-line:before {
    width: 10%;
    display: block;
    content: "";
    height: 1px;
    background-color: grey;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.d-line--2x.d-line--after:after,
.d-line--2x:before {
    height: 2px;
}
.d-line--green.d-line--after:after,
.d-line--green:before {
    background-color: rgba(101, 193, 92, 1.0);
}

.d-line--centered.d-line--after:after,
.d-line--centered:before {
    margin-left: auto;
    margin-right: auto;
}


/** Icons **/
.icon {
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.icon--2x {
    font-size: 2em;
}
.icon--4x {
    font-size: 4em;
}
.icon--color {
    color: rgba(255, 255, 255, 0.7);
}

/** Cross Close **/
.cross-close {
    position: fixed;
    top: 0;
    right: 0;
    padding: 1em;
    z-index: 10;
}
#cross-close-info {
    background-color: #299138;
}

#cross-close-details {
    background-color: black;
}

/** Partial Homepage **/
.homepage-title {
    font-size: 2em;
    margin-top: 0;
    text-align: center;
}
.homepage-title:before {
    height: 2px;
    margin-right: auto;
    margin-left: auto;
    width: 5%;
}
.infras__box {
    padding: 0;
    font-size: 110%;
}
.infras__box:after {
    /* trick to keep height==width
       http://stackoverflow.com/questions/5445491/height-equal-to-dynamic-width-css-fluid-layout
    */
    content: '';
    display: block;
    margin-top: 100%;
}

/** Partial Details **/
.details-title {
    margin: 1em;
    font-size: 1.8em;
}
.details-title .label {
    vertical-align: text-top;
}
.details-banner {
    height: 180px;
    text-align: center;
}
.details-banner__left {
    background-color: black;
}
.details-box-state {
    font-weight: 700;
}
.details-tab {
    width: 33.333%;
    text-align: center;
    text-decoration: none;
    border-radius: 0;
    background-color: black;
    background-clip: content-box;
    border: 0;
    margin: 0 !important;
}
.details-tab.active {
    color: white;
    font-weight: 700;
    border-image-slice: 0% 0% 100% 0%;
    border-width: 0 0 12px 0;
}
.nav-pills > li.details-tab > a {
    background: none;
    padding: 15px 5px;
    border-radius: 0;
}
.nav-pills > li.details-tab > a:hover {
    background: rgba(255,255,255,0.07);
}
.box-content {
    padding: 0;
    background: #252525;
}
.details-tab-content {
    margin: 1.6em 0;
    list-style-type: none;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    padding: 0;
}
.details-tab-content li {
    display: inline-block;
    width: 100%;
}
.details-tab-content a {
    display: block;
    padding: 15px 40px;
    text-decoration: none
}
.details-tab-content a:active,
.details-tab-content a:hover {
    background: rgba(255,255,255,0.1);
}
.details-tab-content__title {
    margin: 0;
    line-height: 1.5;
    text-decoration: underline;
    font-size: 1.15em;
}
#gauge tspan {
    font-size: 1.4em !important;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
    font-weight: 700;
}
/* Map */
#map {
    height: 300px;
    margin: 0;
}

/* Green (OK) */<commit_msg>Change font to Open Sans<commit_after>/* app css stylesheet */

/**
 * CONTENTS
 *
 * BASE
 * Headings.............H1–H6 styles.
 * Links................Styling for links
 *
 * OBJECTS
 * Wrappers.............Wrapping and constraining elements.
 *
 * COMPONENTS
 * Page-head............The main page header.
 * Banner-top...........The main banner top.
 * Banner-bottom........The main banner bottom.
 * Boxes................Boxes containing details state.
 * State-color..........Colors for changes of states.
 * Decorative lines.....Lines used as decoration on titles & other elements.
 * Icons................Icons elements.
 * Cross close..........Cross Close element.
 * Partial Homepage.....Homepage elements.
 * Partial Details......Details page elements.
 * Partial Infos........Infos page elements.
 *
 * RESPONSIVE
 * Large devices........Responsive ajustments for large devices
 * Medium devices.......Responsive ajustments for medium devices
 * Small devices........Responsive ajustments for small devices
 * Extra small devices..Responsive ajustments for extra-small devices
 *
 * HACKS................Workarounds
 *
 */


/*------------------------------------*\
    #BASE
\*------------------------------------*/

body {
    font-family: "Open Sans", "Helvetica Neue",Helvetica,Arial,sans-serif;
    background: url("../img/montreal.jpg") no-repeat center top fixed;
    background-color: black;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: white;
    padding-bottom: 5em;
}

.nav,
.pagination,
.carousel,
.panel-title a { 
    cursor: pointer;
}

.transparent {
    background: black;
    filter: alpha(opacity=50); /* YEAH IE */
    background: rgba(0, 0, 0, 0.50);
}

/** Headings **/
h1, h2, h3, h4, h5 {
    color: #fff;
}
h1 {
    font-size: 2em;
    margin-bottom: 1em;
}
h2 {
    font-size: 1.6em;
}
h2 small {
    margin-left: 0.5em;
}
/** Links **/
a {
    color: #fff;
}
a:active,
a:hover {
    color: rgba(255,255,255,0.8);
}
.link-underline a {
    text-decoration: underline
}
/** Other **/
section {
    margin-bottom: 2em;
}
/*------------------------------------*\
    #COMPONENTS
\*------------------------------------*/

/** Page-head **/
.site-title {
    text-align: center;
    margin-bottom: 1.5em;
}
.site-title a,
.site-title a:hover,
.site-title a:active,
.site-title a:visited {
    color: white;
    text-decoration: none;
}
/** Banner-top **/
.banner {
    padding: 1em;
}

.banner__left {
    font-size: 2em;
    border-right: 1px solid rgba(255, 255, 255, 0.7);
}

/** Banner-bottom **/
.banner-bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 3px 0;
    background-color: #65c178;
}
.banner-bottom a {
    vertical-align: text-top;
}

/** Boxes **/
.box {
    bottom: 17%;
    left: 17%;
    top: 17%;
    right: 17%;
    position: absolute;
    text-align: center;
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.box--round {
    border-radius: 50%;
    border-style: solid;
    border-width: 3px;
}
.box--round:hover {
    border-width: 4px;
    text-decoration: none;
}
.box--round:before,
.box--round::after {
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -moz-box-shadow: 0 2px 10px 0 rgba(0,0,0,.32);
    -webkit-box-shadow: 0 2px 10px 0 rgba(0,0,0,.32);
    box-shadow: 0 2px 10px 0 rgba(0,0,0,.32);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    width: 100%;
}
.box h2 {
    margin-bottom: 0;
    margin-top: 0;
}
.box__inner {
    display: table;
    height: 100%;
    width: 100%;
}
.box__inner_center {
    display: table-cell;
    vertical-align: middle;
}
.box .d-line:before {
    width: 65px;
}
.box:hover .icon--color{
    color: rgba(255, 255, 255, 1);
}
.box:hover .d-line:before {
    background: rgba(255, 255, 255, 1);
}

/***
 * State-color
 * 0: Green (OK)
 * 1: Orange (Warning)
 * 2: Red (Critical)
 * 3: Grey
 *
 * */
/* Green */
.bordercolor_0 { border-color: #65c178; }
.bordercolor_0:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(101,193,120,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(101,193,120,.31);
    box-shadow: 0 8px 17px 0 rgba(101,193,120,.31);
}

.bgcolor_0 { background-color: #65c178; }

.color_0 { color: #65c178; }

/* Orange */
.bordercolor_1 { border-color: #f39c12; }
.bordercolor_1:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(243,156,18,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(243,156,18,.31);
    box-shadow: 0 8px 17px 0 rgba(243,156,18,.31);
}

.bgcolor_1 { background-color: #f39c12; }

.color_1 { color: #f39c12; }

/* Red */
.bordercolor_2 { border-color: #e74c3c; }
.bordercolor_2:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(231,76,60,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(231,76,60,.31);
    box-shadow: 0 8px 17px 0 rgba(231,76,60,.31);
}

.bgcolor_2 { background-color: #e74c3c; }

.color_2 { color: #e74c3c; }


/* Gray */
.bordercolor_3 { border-color: grey; }
.bordercolor_3:hover:after {
    -moz-box-shadow: 0 8px 17px 0 rgba(128,128,128,.31);
    -webkit-box-shadow: 0 8px 17px 0 rgba(128,128,128,.31);
    box-shadow: 0 8px 17px 0 rgba(128,128,128,.31);
}

.bgcolor_3 { background-color: grey; }

.color_3 { color: grey; }

/** Decorative lines **/
.d-line--after:after, 
.d-line:before {
    width: 10%;
    display: block;
    content: "";
    height: 1px;
    background-color: grey;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.d-line--2x.d-line--after:after,
.d-line--2x:before {
    height: 2px;
}
.d-line--green.d-line--after:after,
.d-line--green:before {
    background-color: rgba(101, 193, 92, 1.0);
}

.d-line--centered.d-line--after:after,
.d-line--centered:before {
    margin-left: auto;
    margin-right: auto;
}


/** Icons **/
.icon {
    -moz-transition: all .3s cubic-bezier(.4,0,.2,1);
    -webkit-transition: all .3s cubic-bezier(.4,0,.2,1);
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.icon--2x {
    font-size: 2em;
}
.icon--4x {
    font-size: 4em;
}
.icon--color {
    color: rgba(255, 255, 255, 0.7);
}

/** Cross Close **/
.cross-close {
    position: fixed;
    top: 0;
    right: 0;
    padding: 1em;
    z-index: 10;
}
#cross-close-info {
    background-color: #299138;
}

#cross-close-details {
    background-color: black;
}

/** Partial Homepage **/
.homepage-title {
    font-size: 2em;
    margin-top: 0;
    text-align: center;
}
.homepage-title:before {
    height: 2px;
    margin-right: auto;
    margin-left: auto;
    width: 5%;
}
.infras__box {
    padding: 0;
    font-size: 110%;
}
.infras__box:after {
    /* trick to keep height==width
       http://stackoverflow.com/questions/5445491/height-equal-to-dynamic-width-css-fluid-layout
    */
    content: '';
    display: block;
    margin-top: 100%;
}

/** Partial Details **/
.details-title {
    margin: 1em;
    font-size: 1.8em;
}
.details-title .label {
    vertical-align: text-top;
}
.details-banner {
    height: 180px;
    text-align: center;
}
.details-banner__left {
    background-color: black;
}
.details-box-state {
    font-weight: 700;
}
.details-tab {
    width: 33.333%;
    text-align: center;
    text-decoration: none;
    border-radius: 0;
    background-color: black;
    background-clip: content-box;
    border: 0;
    margin: 0 !important;
}
.details-tab.active {
    color: white;
    font-weight: 700;
    border-image-slice: 0% 0% 100% 0%;
    border-width: 0 0 12px 0;
}
.nav-pills > li.details-tab > a {
    background: none;
    padding: 15px 5px;
    border-radius: 0;
}
.nav-pills > li.details-tab > a:hover {
    background: rgba(255,255,255,0.07);
}
.box-content {
    padding: 0;
    background: #252525;
}
.details-tab-content {
    margin: 1.6em 0;
    list-style-type: none;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    padding: 0;
}
.details-tab-content li {
    display: inline-block;
    width: 100%;
}
.details-tab-content a {
    display: block;
    padding: 15px 40px;
    text-decoration: none
}
.details-tab-content a:active,
.details-tab-content a:hover {
    background: rgba(255,255,255,0.1);
}
.details-tab-content__title {
    margin: 0;
    line-height: 1.5;
    text-decoration: underline;
    font-size: 1.15em;
}
#gauge tspan {
    font-size: 1.4em !important;
    font-family: "Open Sans", "Helvetica Neue",Helvetica,Arial,sans-serif;
}
/* Map */
#map {
    height: 300px;
    margin: 0;
}

/* Green (OK) */
{'fraction_non_alphanumeric': 0.20163427561837455, 'fraction_numerical': 0.0686285335689046, 'mean_word_length': 2.4304924242424244, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 11, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7177622', 'n_tokens_mistral': 7893, 'n_tokens_neox': 6871, 'n_words': 1500}