@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 700;
    src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(https://fonts.gstatic.com/s/titilliumweb/v4/anMUvcNT0H1YN4FII8wpr_5rZpfU3XI-FvUPGDRT0xY.woff) format('woff');
}

@font-face {
    font-family: "Flaticon";
    src: url("../fonts/Flaticon.eot");
    src: url("/fonts/Flaticon.eot?#iefix") format("embedded-opentype"),
    url("../fonts/Flaticon.woff") format("woff"),
    url("../fonts/Flaticon.ttf") format("truetype"),
    url("../fonts/Flaticon.svg#Flaticon") format("svg");
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: "Flaticon";
        src: url("../fonts/Flaticon.svg#Flaticon") format("svg");
    }
}

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {
    font-family: Flaticon;
    font-size: 1.5em;
    font-style: normal;
    margin-left: 20px;
}

.flaticon-black-back-closed-envelope-shape:before { content: "\f100"; }
.flaticon-coderwall-logo:before { content: "\f101"; }
.flaticon-github-logo:before { content: "\f102"; }
.flaticon-linkedin-sign:before { content: "\f103"; }

body {
    color: black;
    height: 100%;
}

a, li a:visited {
    color: black !important;
}

a:hover, a:active {
    color: #333333 !important;
    text-decoration: none;
}

.logoLink:hover, logoLink:active {
    color: #000000 !important;
}

li.active a {
    color: black !important;
}

h1 {
    font-family: 'Archivo Black', sans-serif;
}

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

bigLogo {
    font-family: 'Titillium Web', sans-serif;
    font-size: 230px;
    font-size: 60vw;
    font-weight: 700;
    display: inline-block;
    line-height: 1em;
}

.center{
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contactIcons {
    font-size:2em;
}

.linkIcons {
    font-size: 2em;
    padding:3px;
}

/** BAR CHART **/
.chart-horiz .chart {
    width: 100%
}

.chart-horiz .chart li {
    display: block;
    height: 23px;
    margin-top: 3px;
    position: relative
}

.chart-horiz .chart li:before {
    color: black;
    content: attr(title);
    left: 0px;
    position: absolute
}

.chart-horiz .chart li.title:before {
    color: black;
    font-weight: bold;
    left: 0
}

.chart-horiz .chart li:first-child { margin-top: 0 }

.chart-horiz .chart li .bar {
    background: #27ae60;
    height: 100%;
    min-width: 164px;
    color: black;
}

.chart-horiz .chart li .number {
    color: #27ae60;
    font-size: 18px;
    font-weight: bold;
    padding-left: 0px;
    position: absolute;
    top: -3px;
    color: black;
}

.chart {
    width: 100%;
}

ul {
    padding: 0;
    list-style-type: none;
}
.chart-horiz .chart li.past .bar { background: #2ecc71 }

.chart-horiz .chart li.past .number { color: #2ecc71 }