/*
 *   Box styles
 */
.infograph {
    text-align: center !important;
}
.infograph h1 {
    word-break: keep-all;
    position: relative;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    font-size: 50px;
}
.infograph h3 {
    word-break: keep-all;
    position: relative;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    font-size: 41px;
}
.infograph-box {
    position: relative;
    width: 100%;
    background-color: #292929;
    padding: 30px;
    margin-bottom: 40px;
    overflow: hidden;
}
.info-header-subtitle {
    background-color: #f15a24;
    position: relative;
    width: 80%;
    height: auto;
    margin: auto;
}
.infograph-content-box h1 {
    font-size: 50px
    word-break: keep-all;
}
.infograph-content-box p {
    text-align: center;
    font-size: 35px;
    word-break: keep-all;
}
.src-link {
    font-size: 50px !important;
}

/*
 *   Chart legend
 */
.infograph-box-guide * {
    float: left;
    width: 35%;
    margin: 10px;
    margin-left: 10%;
}
.infograph-box-guide h3 {
    display: inline-block;
    font-weight: 700 !important;
    color: #9D9E9E;
    font-size: 120%;
}
.square-helper {
    padding: 10px;
    display: inline-block;
    font-weight: 400 !important;
    margin-top: 50px;
}
.overall-helper * {
    width: 100%;
    margin-left: 0px !important;
}
.orange-helper {
    background-color: #f15a24;
    color: #fff;
}
.orange-text {
    color: #f15a24 !important;
}
.white-helper {
    background-color: #fff;
    color: #f15a24;
}
.white-text {
    color: #fff;
}
.yellow-helper {
    background-color: #f4c63d;
    color: #fff;
}
.yellow-shadow-helper {
    background-color: #d17905;
    color: #fff;
}
.yellow-clear-helper {
    background-color: #ecba08;
    color: #fff;
}

/*
 * Responsive options
 */ 
@media screen and (min-width: 993px) and (max-width: 1095px){
    .infograph-content-box h1 {
        font-size: 40px;
    }
    .infograph-box h1 {
        font-size: 45px;
    }
    .infograph-box p {
        font-size: 25px;
    }
}
}
@media screen and (min-width: 1095px) and (max-width: 1300px){
    .infograph-content-box h1 {
        font-size: 50px;
    }
    .infograph-box p {
        font-size: 35px;
    }

}

@media screen and (min-width: 550px) and (max-width: 650px){
    .infograph h1 {
        font-size: 50px;
    }
    .infograph h3 {
        font-size: 29px;
    }
    .infograph-content-box h1 {
        font-size: 40px;
    }
    .infograph-content-box p {
        font-size: 23px;
    }
}

@media screen and (min-width: 450px) and (max-width: 650px){
    .infograph h1 {
        font-size: 34px !important;
    }
    .infograph h3 {
        font-size: 20px !important;
    }
    .infograph-content-box h1 {
        font-size: 20px !important;
    }
    .infograph-content-box p {
        font-size: 16px !important;
    }
}
@media screen and (min-width: 370px) and (max-width: 450px){
    .infograph h1 {
        font-size: 40px;
    }
    .infograph h3 {
        font-size: 23px;
    }
    .infograph-content-box h1 {
        font-size: 27px;
    }
    .infograph-content-box p {
        font-size: 15px;
    }
    .infograph-content-box h3 {
        font-size: 15px;
    }
}
@media screen and (max-width: 370px){
    .infograph h1 {
        font-size: 30px;
    }
    .infograph h3 {
        font-size: 17px;
    }
    .infograph-content-box h1 {
        font-size: 20px;
    }
    .infograph-content-box p {
        font-size: 11px;
    }
}

/* ACRESCENTADO CARLOS */
@media screen and (max-width: 715px) and (min-width: 645px){
  
    .infograph-content-box h1 {
        font-size: 35px !important; /**/
    }
    .infograph-content-box p {
        font-size: 23px !important;
    }
}

@media screen and (max-width: 794px) and (min-width: 715px){
  
    .infograph-content-box h1 {
        font-size: 55px !important;
    }
    .infograph-content-box p {
        font-size: 32px !important;
    }
}

@media screen and (max-width: 645px) and  (min-width: 600px){
  
    .infograph-content-box h1 {
        font-size: 45px !important;
    }
    .infograph-content-box p {
        font-size: 25px !important;
    }
}

@media screen and (max-width: 600px) and (min-width: 565px) {
  
    .infograph-content-box h1 {
        font-size: 40px !important;
    }
    .infograph-content-box p {
        font-size: 23px !important;
    }
}
@media screen and (max-width: 565px) and (min-width: 450px)  {
  
    .infograph-content-box h1 {
        font-size: 30px !important;
    }
    .infograph-content-box p {
        font-size: 17px !important;
    }
}






