* {
    font-family: 'Roboto', Arial, sans-serif;
}

/* Variaveis */
:root {
	--main-bg-color: #1a191f;
	--primary-color: #833ab4;
	--secondary-color: #cfcfcf;
    --third-color: #f9ab00;
    --content-color: #949494;
    --content-shadow-color: #292828;
}

body {
font-size: 12px;
background: url('../img/background-top.png') center top no-repeat,
url('../img/cloud.png') center 650px no-repeat,
url('../img/barra-pattern.png') center top repeat-y,
url('../img/background3.png');
background-color: var(--main-bg-color);
}

a {
    text-decoration: none;
}

.aligner {
    width: 1200px;
    margin: 0 auto;
    text-align: center;
    padding-top: 50px;
}

.content {
    float: left;
}

.claims-count {
    width: 1200px;
    margin-top: 600px;
    float: left;
    font-size: 90px;
    color: var(--primary-color);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.64);
    text-align: center;
    /* margin-bottom: 200px; */
    font-weight: 600;
}

.last-update {
    width: 1200px;
    float: left;
    font-size: 16px;
    color: var(--content-color);
    text-transform: uppercase;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.64);
    text-align: center;
    font-weight: 600;
    margin-bottom: 200px;
}

.barra-aligner {
    width: 167px;
    margin: 0 auto;
}

.barra {
    width: 167px;
	margin-top: -128px;
    float: left;
    background: url('../img/barra-bg.png') repeat-y;
    margin-bottom: 160px;
    position: relative;
    min-height: 2000px;
}

.barra:before {
    width: 167px;
    height: 141px;
    float: left;
    content: '';
    margin-top: -141px;
    background: url('../img/barra-bg-top.png') no-repeat;
}

.barra:after {
    width: 167px;
    height: 141px;
    float: left;
    content: '';
    background: url('../img/barra-bg-bottom.png') no-repeat;
    position: absolute;
    left: 0;
    bottom: -141px;
}

.barra-fill {
    width: 159px;
    float: left;
    background: url('../img/barra-pattern.png'), rgba(131,58,180);
    background: url('../img/barra-pattern.png'), linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(239,29,253,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#833ab4",endColorstr="#ef1dfd",GradientType=1);
    position: relative;
    z-index: 100;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    margin-left: 4px;
    margin-top: -50px;
}

.checkPointHolder {
    width: 400px;
    position: absolute;
    z-index: 200;
    left: -120px;
    height: 400px;
    margin-top: -50px;
}

.goalPoint {
    width: 336px;
    height: 38px;
    float: left;
    position: absolute;
    cursor: pointer;
    z-index: 200;
}

.goalPoint.goalRight .kprize {
    left: 238px;
    width: 240px;
    position: absolute;
    text-align: left;
    top: 8px;
}

.goalPoint.goalLeft .kprize {
    right: 238px;
    width: 240px;
    position: absolute;
    text-align: right;
    top: 8px;
}

.goalPoint .kprize span {
    text-transform: uppercase;
    display: block;
}

.goalPoint .kprize span.title {
    font-size: 26px;
    color: var(--primary-color);
    text-shadow: 1px 1px 1px rgb(0, 0, 0);
    line-height: 13px;
    font-weight: 500;
}

.goalPoint .kprize span.subtitle {
    font-size: 18px;
    color: var(--secondary-color);
    text-shadow: 1px 1px 1px rgb(0, 0, 0);
    line-height: 2em;
    font-weight: 400;
}

.goalPoint .kclaims {
    color: #FFF;
    font-size: 26px;
    position: absolute;
    text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.69);
    width: 159px;
    font-weight: 400;
}

.goalPoint.goalLeft .kclaims {
    right: 0;
    top: 0;
}

.goalPoint.goalRight .kclaims {
    left: 0;
    top: 0;
}

.detailsPoint {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background: rgba(29, 27, 26, 0.97);
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
    width: 216px;
    position: absolute;
    text-align: left;
    z-index: 300;
    padding: 10px;
    display: none;
}

.detailsPoint h2 {
    color: var(--secondary-color);
    font-size: 24px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1.2em;
}

.detailsPoint h3 {
    color: var(--primary-color);
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 16px;
    margin-bottom: 5px;
}

.detailsPoint p.desc {
    font-size: 14px;
    color: white;
    padding: 0 12px;
    clear: both;
    margin-bottom: 6px;
}

.detailsPoint p.atingida {
    color: var(--primary-color);
}

.detailsPoint p.nao-atingida {
    color: #c96161;
}

.detailsPoint p.desc img {
    float: left;
    margin-right: 10px;
    width: 19px;
}

.detailsPoint p.desc img.heart {
    margin-top: 5px;
}

.goalLeft {
    left: -53px;
    background: url('../img/checkPointLeftTransp.png') no-repeat;
}

.goalLeft.special {
    background: url('../img/checkPointLeftSpecial.png') no-repeat;
}

.goalRight.special {
    background: url('../img/checkPointRightSpecial.png') no-repeat;
}

.goalRight {
    left: 124px;
    background: url('../img/checkPointRightTransp.png') no-repeat;
}

.detailsLeft {
    left: -213px;
}

.detailsRight {
    left: 390px;
}

.conteudo {
    width: 1200px;
    float: left;
    font-size: 18px;
    color: var(--content-color);
    text-align: left;
}

.conteudo h2 {
    font-size: 22px;
    color: var(--third-color);
    text-transform: uppercase;
    text-shadow: 1px 1px 1px var(--content-shadow-color);
}

.conteudo h3 {
    font-size: 18px;
    color: #000000;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px var(--content-shadow-color);
}

.conteudo .conteudo50 {
    width: 449px;
    float: left;
    padding: 0 25px;
    margin-bottom: 10px;
}

.conteudo .conteudo100 {
    width: 899px;
    float: left;
    padding: 0 50px;
    margin-bottom: 10px;
}

.conteudo p {
    margin-bottom: 10px;
    text-align: justify;
}

.conteudo .conteudo50 p {

}

.conteudo .conteudo100 p {
    padding: 0 15px;
}

.footer {
    width: 100%;
    min-height: 134px;
    text-align: center;
    margin-top: 30px;
    float: left;
}

.footer .footer-content {

    display: flex;
    justify-content: center;
}

.footer .barra-footer {
    width: 159px;
    float: left;
}

.footer .barra-footer img {
    width: 200px;
}

.footer .barra-footer .barra-fill-kzp {
    width: 90px;
    float: left;
    max-height: 200px;
    background: url('../img/barra-pattern.png'), #2b3e5d; /* Old browsers */
    background: url('../img/barra-pattern.png'), -moz-linear-gradient(top, #2b3e5d 0%, #4d70ab 56%); /* FF3.6+ */
    background: url('../img/barra-pattern.png'), -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b3e5d), color-stop(56%, #4d70ab)); /* Chrome,Safari4+ */
    background: url('../img/barra-pattern.png'), -webkit-linear-gradient(top, #2b3e5d 0%, #4d70ab 56%); /* Chrome10+,Safari5.1+ */
    background: url('../img/barra-pattern.png'), -o-linear-gradient(top, #2b3e5d 0%, #4d70ab 56%); /* Opera 11.10+ */
    background: url('../img/barra-pattern.png'), -ms-linear-gradient(top, #2b3e5d 0%, #4d70ab 56%); /* IE10+ */
    background: url('../img/barra-pattern.png'), linear-gradient(to bottom, #2b3e5d 0%, #4d70ab 56%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2b3e5d', endColorstr='#4d70ab', GradientType=0); /* IE6-9 */

    position: relative;
    z-index: 100;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    margin-left: 71px;
    position: absolute;
    bottom: 0;
}

.footer .barra-footer .barra-fill-mhp {
    width: 90px;
    float: left;
    max-height: 200px;
    background: url('../img/barra-pattern.png'), #5d2b2b; /* Old browsers */
    background: url('../img/barra-pattern.png'), -moz-linear-gradient(top, #5d2b2b 0%, #973838 56%); /* FF3.6+ */
    background: url('../img/barra-pattern.png'), -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5d2b2b), color-stop(56%, #973838)); /* Chrome,Safari4+ */
    background: url('../img/barra-pattern.png'), -webkit-linear-gradient(top, #5d2b2b 0%, #973838 56%); /* Chrome10+,Safari5.1+ */
    background: url('../img/barra-pattern.png'), -o-linear-gradient(top, #5d2b2b 0%, #973838 56%); /* Opera 11.10+ */
    background: url('../img/barra-pattern.png'), -ms-linear-gradient(top, #5d2b2b 0%, #973838 56%); /* IE10+ */
    background: url('../img/barra-pattern.png'), linear-gradient(to bottom, #5d2b2b 0%, #973838 56%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5d2b2b', endColorstr='#973838', GradientType=0); /* IE6-9 */
    position: relative;
    z-index: 100;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    margin-left: 61px;
    position: absolute;
    bottom: 0;
}

.footer .barra-footer .barra-fill-hp {
    width: 90px;
    float: left;
    max-height: 200px;
    background: url('../img/barra-pattern.png'), rgba(255, 175, 75, 1);
    background: url('../img/barra-pattern.png'), -moz-linear-gradient(top, rgba(255, 175, 75, 1) 0%, rgba(255, 146, 10, 1) 100%);
    background: url('../img/barra-pattern.png'), -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 175, 75, 1)), color-stop(100%, rgba(255, 146, 10, 1)));
    background: url('../img/barra-pattern.png'), -webkit-linear-gradient(top, rgba(255, 175, 75, 1) 0%, rgba(255, 146, 10, 1) 100%);
    background: url('../img/barra-pattern.png'), -o-linear-gradient(top, rgba(255, 175, 75, 1) 0%, rgba(255, 146, 10, 1) 100%);
    background: url('../img/barra-pattern.png'), -ms-linear-gradient(top, rgba(255, 175, 75, 1) 0%, rgba(255, 146, 10, 1) 100%);
    background: url('../img/barra-pattern.png'), linear-gradient(to bottom, rgba(255, 175, 75, 1) 0%, rgba(255, 146, 10, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffaf4b', endColorstr='#ff920a', GradientType=0);
    position: relative;
    z-index: 100;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    margin-left: 61px;
    position: absolute;
    bottom: 0;
}

.footer .barra-footer .barra-fill-hr {
    width: 90px;
    float: left;
    max-height: 200px;
    background: url('../img/barra-pattern.png'), rgba(164, 179, 87, 1);
    background: url('../img/barra-pattern.png'), -moz-linear-gradient(top, rgba(20, 198, 92, 1) 0%, rgba(20, 163, 77, 1) 100%);
    background: url('../img/barra-pattern.png'), -webkit-gradient(left top, left bottom, color-stop(0%, rgba(20, 198, 92, 1)), color-stop(100%, rgba(20, 163, 77, 1)));
    background: url('../img/barra-pattern.png'), -webkit-linear-gradient(top, rgba(20, 198, 92, 1) 0%, rgba(20, 163, 77, 1) 100%);
    background: url('../img/barra-pattern.png'), -o-linear-gradient(top, rgba(20, 198, 92, 1) 0%, rgba(20, 163, 77, 1) 100%);
    background: url('../img/barra-pattern.png'), -ms-linear-gradient(top, rgba(20, 198, 92, 1) 0%, rgba(20, 163, 77, 1) 100%);
    background: url('../img/barra-pattern.png'), linear-gradient(to bottom, rgba(20, 198, 92, 1) 0%, rgba(20, 163, 77, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#14a34d', endColorstr='#14c65c', GradientType=0);
    position: relative;
    z-index: 100;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 10px 16px 8px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    margin-left: 61px;
    position: absolute;
    bottom: 0;
}

.footer .barra-footer span {
    width: 100%;
    float: left;
    clear: both;
    text-align: center;
    color: var(--secondary-color);
    font-size: 16px;
    margin-bottom: 5px;
    margin-top: -24px;
    color: white;
}

.footer .barra-footer-wrap {
    height: 166px;
    position: relative;
}

.footer h2 {
    color: var(--secondary-color);
    font-size: 34px;
    font-weight: 600;
    text-shadow: 1px 1px 0 #000;
    text-transform: uppercase;
    padding: 100px 0px;
}