#pointList {
    margin: 1em;
    background: white;
    box-shadow: 0 0 5px #ccc;
}

#pointList li {
    display: block;    
    border-bottom: 1px solid #ccc;
    padding: 1em 0;
    overflow: hidden;
}

#pointList img {
    float: left;
    width: 70px;height:70px;margin: 1.2em 1em;
}

#pointList h1, #pointList h2 {
    display: inline-block;
    margin: 0;
    font-size:1.4rem !important;
}

#pointList li.negative h2{
    color: #e74338;
}

#pointList progress[value] {
    width: calc(100% - 80px - 3em);
    height: 5px;
    border: none;
    margin: 0;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
#pointList progress[value]::-webkit-progress-bar {
    background: #ddd;
}
#pointList progress[value]::-moz-progress-bar {
    background: #ddd;
}

#pointList progress[value]::-webkit-progress-value {
    background: #0361d5;
}
#pointList progress[value]::-moz-progress-value {
    background: #0361d5;
}

#alertBox, .alertBox {
    display: none;
    position: fixed;
    background: white;
    box-shadow: 0 0 10px #333;
    box-sizing: border-box;
    top: 30vh;
    width: calc(100vw - 4em);
    margin: 2em;
    padding: 1em;
    z-index: 10;
}

#alertBox.show, .alertBox.show {
    display: block;
}


#alertBox h3, .alertBox h3 {
    font-weight: normal;
    margin: 0.5em;
}

#alertBox #duration, .alertBox h3 {
    margin-top: 1.5em;
}
#alertBox #title, .alertBox h1 {
    font-size:1.4rem !important;
}

#definition{display:none}