/* Imports */


/******************************
* COLORS *
******************************/


/******************************
* TYPO *
******************************/

@font-face {
    font-family: 'Bebas Neue';
    font-style: normal;
    font-weight: normal;
    src: local('webfonts/Bebas Neue'), url('webfonts/BebasNeue.woff') format('woff');
}

p {
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
    font-size: 18px;
}


/******************************
* IMG *
******************************/


/******************************
* LINK *
******************************/


/******************************
* SCAFFOLDING *
******************************/


/******************************
* SPEC *
******************************/


/******************************
* COLOR *
******************************/


/******************************
* TYPO *
******************************/


/******************************
* LINK *
******************************/


/******************************
* BORDER *
******************************/


/******************************
 * BODY, HTML *
 ******************************/

html {
    letter-spacing: 0.05rem;
}

.margin-top-5 {
    margin-top: 5px;
}

.margin-top-10 {
    margin-top: 10px;
}

.margin-top-15 {
    margin-top: 15px;
}

.margin-top-20 {
    margin-top: 20px;
}

.margin-top-25 {
    margin-top: 25px;
}

.margin-top-30 {
    margin-top: 30px;
}

.margin-top-35 {
    margin-top: 35px;
}

.margin-top-40 {
    margin-top: 40px;
}

.margin-top-45 {
    margin-top: 45px;
}

.margin-top-50 {
    margin-top: 50px;
}

.margin-top-55 {
    margin-top: 55px;
}

.margin-top-60 {
    margin-top: 60px;
}

.margin-top-65 {
    margin-top: 65px;
}

.margin-top-70 {
    margin-top: 70px;
}

.margin-top-75 {
    margin-top: 75px;
}

.margin-top-80 {
    margin-top: 80px;
}

.margin-top-85 {
    margin-top: 85px;
}

.margin-top-90 {
    margin-top: 90px;
}

.margin-top-95 {
    margin-top: 95px;
}

.margin-top-100 {
    margin-top: 100px;
}

.margin-top-105 {
    margin-top: 105px;
}

.margin-bottom-5 {
    margin-bottom: 5px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-bottom-15 {
    margin-bottom: 15px;
}

.margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-bottom-25 {
    margin-bottom: 25px;
}

.margin-bottom-30 {
    margin-bottom: 30px;
}

.margin-bottom-35 {
    margin-bottom: 35px;
}

.margin-bottom-40 {
    margin-bottom: 40px;
}

.margin-bottom-45 {
    margin-bottom: 45px;
}

.margin-bottom-50 {
    margin-bottom: 50px;
}

.margin-bottom-55 {
    margin-bottom: 55px;
}

.margin-bottom-60 {
    margin-bottom: 60px;
}

.margin-bottom-65 {
    margin-bottom: 65px;
}

.margin-bottom-70 {
    margin-bottom: 70px;
}

.margin-bottom-75 {
    margin-bottom: 75px;
}

.margin-bottom-80 {
    margin-bottom: 80px;
}

.margin-bottom-85 {
    margin-bottom: 85px;
}

.margin-bottom-90 {
    margin-bottom: 90px;
}

.margin-bottom-95 {
    margin-bottom: 95px;
}

.margin-bottom-100 {
    margin-bottom: 100px;
}

.margin-bottom-105 {
    margin-bottom: 105px;
}


/******************************
 * HEADER *
 ******************************/

.bkg.show-bkg {
    background-image: url("/site/themes/sdg/imgs/country_city_datas/bkg-xl.jpg");
    background-position: 50% 60%;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #66dcf5;
    height: 100vh;
}

.bkg.show-bkg.bkg-cities {
    background-image: url("/site/themes/sdg/imgs/country_city_datas/bkg-xl-canada.jpg");
}

h1 {
    font-size: 25px;
    line-height: 1.2em;
}

.top-section {
    background: none;
    height: 100vh;
}

.top-section .top-section-hero {
    text-align: center;
    color: #fff;
}

.top-section .top-section-hero h1 {
    font-size: 50px;
    text-transform: uppercase;
    margin-bottom: 0.50em;
    color: #fff;
}

.top-section .top-section-hero p {
    font-size: 28px;
    font-weight: 200;
    margin-bottom: 0;
    line-height: 1.2em;
}

.top-section .top-section-hero .hero-text-center {
    width: 100%;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.hero-text-center p {
    font-family: PlantinMTPro-Regular, Georgia, serif;
}

section.how-to-navigate {
    background-color: #003567;
    color: #fff;
}

section.how-to-navigate p {
    font-size: 17px;
    font-weight: 200;
}

section.how-to-navigate p.title {
    font-weight: 600;
    font-size: 18px;
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
    margin-bottom: 0.5em;
}

section.how-to-navigate.content.row {
    padding-top: 4em;
    padding-bottom: 1.5em;
}

section.select-country-help {
    text-align: center;
    background-color: #003567;
    color: #fff;
    font-size: 16px;
    padding: 10px 0;
}


/******************************
 * CONTENT *
 ******************************/

.row.content {
    padding-top: 4em;
    padding-bottom: 4em;
}

.indicator-popularity-links {
    border-radius: 0;
    padding: 4px 15px;
    background-color: #003567;
    color: #fff;
    margin-bottom: 40px;
    display: inline-block;
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif !important;
}

.indicator-popularity-links a:link {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

.indicator-popularity-links a:visited {
    color: #fff;
}

.indicator-popularity-links a:hover {
    color: #00c4ee;
}

.indicator-popularity-links a.active {
    color: #00c4ee !important;
}

.indicator-popularity-links span {
    margin: 0 5px;
}


/******************************
 * FORMS *
 ******************************/

.select-blue {
    width: 100%;
    border-radius: 0;
    overflow: hidden;
    background: #fafafa url("/site/themes/sdg/imgs/country_city_datas/dropdown-arrow-blue.png") no-repeat 98% 50%;
    background-color: #003567;
    color: #fff;
    margin: 0 0 20px 21px;
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 700;
    margin-left: 0px;
    text-transform: uppercase;
}

.select-blue select {
    padding: 10px 8px 8px;
    width: 110%;
    border: none;
    box-shadow: none;
    background: transparent;
    background-image: none;
    -webkit-appearance: none;
    text-transform: uppercase;
}

.select-blue select option:nth-child(n) {
    background-color: #003567;
    color: #fff;
}

.select-blue select:focus {
    outline: none;
}

.select-blue-2 {
    width: 100%;
    border-radius: 0;
    overflow: hidden;
    background: #fafafa url("/site/themes/sdg/imgs/country_city_datas/dropdown-arrow-blue.png") no-repeat 98% 50%;
    background-color: #003567;
    color: #fff;
    margin: 0 0 20px;
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 700;
}

.select-blue-2 select {
    padding: 10px 8px 8px;
    width: 110%;
    border: none;
    box-shadow: none;
    background: transparent;
    background-image: none;
    -webkit-appearance: none;
    text-transform: uppercase;
}

.select-blue-2 select option:nth-child(n) {
    background-color: #003567;
    color: #fff;
}

.select-blue-2 select:focus {
    outline: none;
}


/******************************
 * SPEC. *
 ******************************/
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #fff;
    opacity: 1;
}
::-moz-placeholder { /* Firefox 19+ */
    color: #fff;
    opacity: 1;
}
:-ms-input-placeholder { /* IE 10+ */
    color: #fff;
}
:-moz-placeholder { /* Firefox 18- */
    color: #fff;
    opacity: 1;
}

/******************************
 * CAROUSEL *
 ******************************/

.carousel-container {
    text-align: center;
    position: relative;
}

.carousel-container .carousel {
    position: relative;
}

.carousel-container .carousel .carousel-control {
    background-image: none;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 20px;
    color: #fff;
    text-align: center;
    filter: alpha(opacity=50);
    opacity: 0.5;
    left: 0;
    font-size: 20px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    background-color: rgba(0, 0, 0, 0);
}

.carousel-container .carousel .carousel-control .carousel-arrow {
    width: 17px;
    height: 54px;
    display: inline-block;
    position: absolute;
    top: 50%;
    margin-top: -25px;
}

.carousel-container .carousel .carousel-control.left .carousel-arrow {
    background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-left.png");
    left: 0;
}

.carousel-container .carousel .carousel-control.right .carousel-arrow {
    background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-right.png");
    right: 0;
}

.carousel-container .carousel .carousel-inner {
    width: 100%;
    padding-left: 30px;
    padding-right: 30px;
}

.carousel-container .carousel .carousel-inner .item {
    opacity: 0;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding-left: 10px;
}

.carousel-container .carousel .carousel-inner .item .top-indicators {
    background-color: #eb1c2e;
    padding: 2px 4px;
    color: #fff;
    font-size: 14px;
    margin-left: -7px;
}

.carousel-container .carousel .carousel-inner .active {
    opacity: 1;
}

.carousel-container .carousel .carousel-inner .active.left, .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
}

.carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .prev.right, .carousel-container .carousel .carousel-inner .next.left {
    opacity: 1;
}


/*carousel added*/

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.carousel-inner>.item.next.left, .carousel-inner>.item.prev.right, .carousel-inner>.item.active {
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.carousel-inner>.item {
    -webkit-transition: -webkit-transform .6s ease-in-out;
    -o-transition: -o-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
    position: relative;
    display: none;
}

.carousel-inner>.active {
    left: 0;
    overflow: hidden;
    padding-left: 0px !important;
}

.carousel-inner>.active, .carousel-inner>.next, .carousel-inner>.prev {
    display: block;
}

.carousel-container .carousel .carousel-control.left {
    background-repeat: repeat-x;
}

.carousel-container .carousel .carousel-control.right {
    right: 0;
    left: auto;
    background-repeat: repeat-x;
}

.carousel-inner>.item.active>.row {
    overflow: hidden;
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s;
}


/*SELECT COUNTRY*/

section.select-country-and-goals {
    background-color: #f4f4f4;
}

.goal-box-container {
    padding: 12px;
    width: 19.888888%;
    float: left;
}

.percent-box-container {
    line-height: 1.1em;
    text-align: center;
    padding: 10px;
}

.percent-box-container span {
    display: inline-block;
    margin-top: 10px;
}

table .percent-box-container {
    line-height: 1.1em;
    text-align: center;
    padding: 0px;
}

table .percent-box-container .reported-not-reported.no .border {
    fill: #00c4ee;
}

table .percent-box-container .reported-not-reported.no .bg {
    fill: #fff;
}

table .percent-box-container .reported-not-reported.no .sign {
    fill: #00c4ee;
}

table .percent-box-container .reported-not-reported.yes .border {
    fill: #00c4ee;
}

table .percent-box-container .reported-not-reported.yes .bg {
    fill: #00c4ee;
}

table .percent-box-container .reported-not-reported.yes .sign {
    fill: #fff;
}

table .percent-box-container .reported-not-reported.un-indic .border {
    fill: #003567;
}

table .percent-box-container .reported-not-reported.un-indic .bg {
    fill: #003567;
}

table .percent-box-container .reported-not-reported.un-indic .sign {
    fill: #fff;
}

table .percent-box-container .reported-not-reported.dark.no .sign, table .percent-box-container .reported-not-reported.dark.no .border {
    fill: #003567;
}

table .percent-box-container .reported-not-reported.dark.yes .bg, table .percent-box-container .reported-not-reported.dark.yes .border {
    fill: #003567;
}

table .percent-box-container span {
    display: inline-block;
    margin-top: 10px;
}

.percent-box {
    width: 33px;
    height: 33px;
    border: 1px solid #fff;
    margin: 0 auto;
    position: relative;
    background: url("/site/themes/sdg/imgs/country_city_datas/percent-box-bg.png");
    background-position: left bottom;
    background-repeat: no-repeat;
}

.percent-box.popularity {
    width: 33px;
    height: 33px;
    border: 1px solid #00c4ee;
    background-color: #00c4ee !important;
    margin: 0 auto;
    position: relative;
    background: url("/site/themes/sdg/imgs/country_city_datas/percent-box-popularity-bg.png");
    background-position: left bottom;
    background-repeat: no-repeat;
}

section.indicators .goal-box-container {
    margin: 0.5%;
    padding: 0;
    width: 18.7777777%;
    float: left;
    position: relative;
}

section.indicators .goal-box-container:before {
    content: "";
    display: block;
    padding-top: 100%;
    /* initial ratio of 1:1*/
}

section.indicators .goal-box-container a:link {
    display: block;
    background-size: 100% !important;
    padding: 10px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

section.indicators .goal-box-container a:link .percent-box {
    padding: 0;
    margin-right: 1.5889999%;
    margin-bottom: 1%;
    width: 15%;
    height: 15%;
    float: left;
    border: 1px solid #fff;
    background: url("/site/themes/sdg/imgs/country_city_datas/percent-box-bg.png");
    background-position: left bottom;
    background-repeat: no-repeat;
}

.select-country {
    padding: 30px 0 0;
    background-color: #ffffff;
}

.select-country .select-blue {
    margin-left: 80px;
}

section.indicator-legend {
    background-color: #003567;
    color: #fff;
    padding: 20px 0;
}

section.indicator-legend .separator {
    background: url("/site/themes/sdg/imgs/country_city_datas/percent-box-bg.png");
    background-size: 1px 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

section.indicator-legend .datas p {
    margin-bottom: 0.1em;
    position: relative;
    font-size: 18px;
}

section.indicator-legend .datas p span.number {
    font-weight: bold;
    display: inline-block;
    border: 1px solid #fff;
    padding: 0 3px 3px;
    border-right: 6px solid #00c4ee;
    line-height: 1em;
}

section.indicator-legend .datas p span.city {
    text-transform: uppercase;
    font-weight: bold;
    display: inline;
}

section.indicator-legend p {
    font-size: 17px;
    font-weight: 200;
}

section.indicator-legend.content.row {
    padding-top: 4em;
    padding-bottom: 1.5em;
}

section.indicator-legend h4 {
    border-bottom: 1px solid #fff;
    padding-bottom: 10px;
}

.indicator-legend span {
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
}

.reported-not-reported.no .bg {
    fill: #003567;
}

.reported-not-reported.no .border {
    fill: #fff;
}

.reported-not-reported.no .sign {
    fill: #fff;
}

.reported-not-reported.yes .bg {
    fill: #fff;
}

.reported-not-reported.yes .border {
    fill: #fff;
}

.reported-not-reported.yes .sign {
    fill: #003567;
}

.reported-not-reported svg {
    width: 35px;
    height: 35px;
}

.absolute-center {
    width: 100%;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

section.select-a-goal {
    background-color: #fff;
}

section.select-a-goal p {
    margin-top: -5px;
    margin-left: 0;
}

section.select-a-goal-2 {
    padding: 30px 0;
}

section.indicators {
    background-color: #f4f4f4;
}

section.indicators .goal-box-container.rc-1 .reported.yes .bg {
    fill: #E0263D;
}

section.indicators .goal-box-container.rc-1 .reported.yes .border {
    fill: #E0263D;
}

section.indicators .goal-box-container.rc-1 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-1 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-1 .reported.no .border {
    fill: #E0263D;
}

section.indicators .goal-box-container.rc-1 .reported.no .sign {
    fill: #E0263D;
}

section.indicators .goal-box-container.rc-2 .reported.yes .bg {
    fill: #D8A238;
}

section.indicators .goal-box-container.rc-2 .reported.yes .border {
    fill: #D8A238;
}

section.indicators .goal-box-container.rc-2 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-2 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-2 .reported.no .border {
    fill: #D8A238;
}

section.indicators .goal-box-container.rc-2 .reported.no .sign {
    fill: #D8A238;
}

section.indicators .goal-box-container.rc-3 .reported.yes .bg {
    fill: #4C9A45;
}

section.indicators .goal-box-container.rc-3 .reported.yes .border {
    fill: #4C9A45;
}

section.indicators .goal-box-container.rc-3 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-3 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-3 .reported.no .border {
    fill: #4C9A45;
}

section.indicators .goal-box-container.rc-3 .reported.no .sign {
    fill: #4C9A45;
}

section.indicators .goal-box-container.rc-4 .reported.yes .bg {
    fill: #C0202F;
}

section.indicators .goal-box-container.rc-4 .reported.yes .border {
    fill: #C0202F;
}

section.indicators .goal-box-container.rc-4 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-4 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-4 .reported.no .border {
    fill: #C0202F;
}

section.indicators .goal-box-container.rc-4 .reported.no .sign {
    fill: #C0202F;
}

section.indicators .goal-box-container.rc-5 .reported.yes .bg {
    fill: #EF402C;
}

section.indicators .goal-box-container.rc-5 .reported.yes .border {
    fill: #EF402C;
}

section.indicators .goal-box-container.rc-5 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-5 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-5 .reported.no .border {
    fill: #EF402C;
}

section.indicators .goal-box-container.rc-5 .reported.no .sign {
    fill: #EF402C;
}

section.indicators .goal-box-container.rc-6 .reported.yes .bg {
    fill: #29B9DE;
}

section.indicators .goal-box-container.rc-6 .reported.yes .border {
    fill: #29B9DE;
}

section.indicators .goal-box-container.rc-6 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-6 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-6 .reported.no .border {
    fill: #29B9DE;
}

section.indicators .goal-box-container.rc-6 .reported.no .sign {
    fill: #29B9DE;
}

section.indicators .goal-box-container.rc-7 .reported.yes .bg {
    fill: #F6BE17;
}

section.indicators .goal-box-container.rc-7 .reported.yes .border {
    fill: #F6BE17;
}

section.indicators .goal-box-container.rc-7 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-7 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-7 .reported.no .border {
    fill: #F6BE17;
}

section.indicators .goal-box-container.rc-7 .reported.no .sign {
    fill: #F6BE17;
}

section.indicators .goal-box-container.rc-8 .reported.yes .bg {
    fill: #9E1C43;
}

section.indicators .goal-box-container.rc-8 .reported.yes .border {
    fill: #9E1C43;
}

section.indicators .goal-box-container.rc-8 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-8 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-8 .reported.no .border {
    fill: #9E1C43;
}

section.indicators .goal-box-container.rc-8 .reported.no .sign {
    fill: #9E1C43;
}

section.indicators .goal-box-container.rc-9 .reported.yes .bg {
    fill: #F26A29;
}

section.indicators .goal-box-container.rc-9 .reported.yes .border {
    fill: #F26A29;
}

section.indicators .goal-box-container.rc-9 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-9 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-9 .reported.no .border {
    fill: #F26A29;
}

section.indicators .goal-box-container.rc-9 .reported.no .sign {
    fill: #F26A29;
}

section.indicators .goal-box-container.rc-10 .reported.yes .bg {
    fill: #D71968;
}

section.indicators .goal-box-container.rc-10 .reported.yes .border {
    fill: #D71968;
}

section.indicators .goal-box-container.rc-10 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-10 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-10 .reported.no .border {
    fill: #D71968;
}

section.indicators .goal-box-container.rc-10 .reported.no .sign {
    fill: #D71968;
}

section.indicators .goal-box-container.rc-11 .reported.yes .bg {
    fill: #F89926;
}

section.indicators .goal-box-container.rc-11 .reported.yes .border {
    fill: #F89926;
}

section.indicators .goal-box-container.rc-11 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-11 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-11 .reported.no .border {
    fill: #F89926;
}

section.indicators .goal-box-container.rc-11 .reported.no .sign {
    fill: #F89926;
}

section.indicators .goal-box-container.rc-12 .reported.yes .bg {
    fill: #BA872D;
}

section.indicators .goal-box-container.rc-12 .reported.yes .border {
    fill: #BA872D;
}

section.indicators .goal-box-container.rc-12 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-12 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-12 .reported.no .border {
    fill: #BA872D;
}

section.indicators .goal-box-container.rc-12 .reported.no .sign {
    fill: #BA872D;
}

section.indicators .goal-box-container.rc-13 .reported.yes .bg {
    fill: #407F44;
}

section.indicators .goal-box-container.rc-13 .reported.yes .border {
    fill: #407F44;
}

section.indicators .goal-box-container.rc-13 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-13 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-13 .reported.no .border {
    fill: #407F44;
}

section.indicators .goal-box-container.rc-13 .reported.no .sign {
    fill: #407F44;
}

section.indicators .goal-box-container.rc-14 .reported.yes .bg {
    fill: #1992D1;
}

section.indicators .goal-box-container.rc-14 .reported.yes .border {
    fill: #1992D1;
}

section.indicators .goal-box-container.rc-14 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-14 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-14 .reported.no .border {
    fill: #1992D1;
}

section.indicators .goal-box-container.rc-14 .reported.no .sign {
    fill: #1992D1;
}

section.indicators .goal-box-container.rc-15 .reported.yes .bg {
    fill: #58B947;
}

section.indicators .goal-box-container.rc-15 .reported.yes .border {
    fill: #58B947;
}

section.indicators .goal-box-container.rc-15 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-15 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-15 .reported.no .border {
    fill: #58B947;
}

section.indicators .goal-box-container.rc-15 .reported.no .sign {
    fill: #58B947;
}

section.indicators .goal-box-container.rc-16 .reported.yes .bg {
    fill: #026999;
}

section.indicators .goal-box-container.rc-16 .reported.yes .border {
    fill: #026999;
}

section.indicators .goal-box-container.rc-16 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-16 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-16 .reported.no .border {
    fill: #026999;
}

section.indicators .goal-box-container.rc-16 .reported.no .sign {
    fill: #026999;
}

section.indicators .goal-box-container.rc-17 .reported.yes .bg {
    fill: #18496B;
}

section.indicators .goal-box-container.rc-17 .reported.yes .border {
    fill: #18496B;
}

section.indicators .goal-box-container.rc-17 .reported.yes .sign {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-17 .reported.no .bg {
    fill: #f4f4f4;
}

section.indicators .goal-box-container.rc-17 .reported.no .border {
    fill: #18496B;
}

section.indicators .goal-box-container.rc-17 .reported.no .sign {
    fill: #18496B;
}

section.indicators .goal-box-container a:link .reported {
    padding: 0;
    margin-right: 1.5889999%;
    margin-bottom: 1%;
    width: 15%;
    height: 15%;
    float: left;
}

table.table-report {
    color: #00c4ee;
    border-color: #00c4ee;
}

table.table-report thead tr {
    border-bottom: 5px solid #00c4ee;
}

table.table-report thead tr th {
    padding-left: 0;
    padding-right: 20px;
    white-space: nowrap;
    font-size: 105%;
    font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 700;
    border: none;
}

table.table-report tfoot {
    border-bottom: 5px solid #00c4ee;
}

table.table-report tr td {
    padding-left: 0;
    border-color: #00c4ee;
}

table.table-report tr td.icon-in-table-td {
    text-align: center;
    vertical-align: middle;
}

.table-report tfoot td {
    border-top: none !important;
}

table.table-report {
    font-size: 17px;
}

table.table-report-last-col-right tbody tr td:last-child, .table thead tr th:last-child {
    padding-right: 0px !important;
    text-align: right;
    float: right;
}

table.table-report>tbody>tr {
    border-top: 1px solid #00c4ee;
}

table.table-report>tbody>tr>td {
    border-top: none;
}

section.select-country-and-cities {
    background-color: #fff;
    padding-top: 20px;
    padding-bottom: 0px !important;
}

section.select-a-goal-2.small-pad {
    padding-bottom: 0;
}

i.table-pager-arrow {
    width: 13px;
    height: 23px;
    margin-bottom: -7px;
    background: none;
}

i.arrow-left {
    background-image: url("/site/themes/sdg/imgs/country_city_datas/table-pager-arrow-left.png");
    margin-left: 5px;
}

i.arrow-right {
    background-image: url("/site/themes/sdg/imgs/country_city_datas/table-pager-arrow-right.png");
}

.flex-container-pager {
    display: flex;
    flex-direction: row;
}

.flex-container-pager .flex-item-pager {
    flex: 1;
}

.flex-container-pager .flex-item-pager:nth-child(2) {
    text-align: right;
}

.flex-container-pager .flex-item-pager:nth-child(2) a:link {
    display: inline-block;
    width: 13px;
    height: 23px;
}

.flex-container-pager .flex-item-pager:nth-child(2) a:link i {
    display: inline-block;
    width: 13px;
    height: 23px;
}

.flex-container-pager a:link i {
    width: 13px;
    display: inline-block;
    height: 23px;
}

.col-no-left-padding {
    padding-left: 0px;
}


/******************************
 * ADDDDDDDD  *
 ******************************/

 /*TABLE*/

 .table>thead>tr>th {
     vertical-align: bottom;
     border-bottom: 2px solid #ddd;
 }

 .table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
     padding: 8px;
     line-height: 1.42857143;
     vertical-align: top;
     border-top: 1px solid #ddd;
 }

 th {
     text-align: left;
 }

 .table {
     width: 100%;
     max-width: 100%;
     margin-bottom: 20px;
 }

 table {
     background-color: transparent;
 }

 .no_indicators_wrapper {
     background-color: #29c3ec !important;
     margin-top: 10px;
     margin-bottom: 40px;
 }

 .no_indicators {
     background-color: transparent;
     text-align: left;
     margin-top: 10px;
     margin-bottom: 10px;
     padding: 10px 0px 10px 15px;
     font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif;
     font-weight: 700;
     color: #fff;
 }

 .right-aligned {
     text-align: right !important;
 }

 .goal-column-container {
     display: inline-block;
     margin-right: 7px;
     margin-left: 7px;
 }

 .goal-box-container {
     margin: 10px 0px 10px 0px !important;
     padding: 0 !important;
     float: left;
     position: relative;
 }

 .goal-box-container:before {
     content: "";
     display: block;
     padding-top: 100%;
     /* initial ratio of 1:1*/
 }

 .goal-box-container a:link {
     display: block;
     background-size: 100%;
     padding: 10px;
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     cursor: default;
 }

 .goal-box-container a:hover {
     text-decoration: none;
 }

 .goal-box-container a:link .percent-box {
     padding: 0;
     margin-right: 1.5889999%;
     margin-bottom: 1%;
     width: 15%;
     height: 15%;
     float: left;
     border: 1px solid #fff;
     background: url("/site/themes/sdg/imgs/country_city_datas/percent-box-bg.png");
     background-position: left bottom;
     background-repeat: no-repeat;
 }

 .goal-box-container a:link .reported {
     padding: 0;
     margin-right: 1.5889999%;
     margin-bottom: 1%;
     width: 15%;
     height: 15%;
     float: left;
 }

 .indicator-boxes-container {
     height: 100%;
 }

 .goal-box-text .right-aligned {
     text-align: right;
 }

 .goal-box-text {
     font-family: 'Bebas Neue', sans-serif !important;
     color: #fff;
     display: inline-block;
     position: absolute;
     z-index: 100;
 }

 .goal-number {
     font-size: 45px;
     left: 20px;
     top: 5px;
 }

 .goal-number-small {
     font-size: 24px;
     left: 20px;
     top: 5px;
 }

 .goal-name {
     font-size: 18px;
     text-align: left;
     line-height: 1em;
     top: 17px;
     left: 49px;
 }

 .goal-name-small {
     font-size: 11px;
     text-align: left;
     line-height: 1em;
     top: 15px;
     left: 49px;
 }


 /* goal box 1 */

 .goal-indicator-box-1-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-1-new.svg);
 }

 .goal-indicator-box-1-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-1-empty.svg);
 }

 .goal-indicator-box-1-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-1-bg.svg);
 }

 .goal-indicator-box-1-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-1-bg.svg);
 }

 .goal-box-container.rc-1 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-1 .reported.no .border {
     fill: #E0263D;
 }

 .goal-box-container.rc-1 .reported.no .sign {
     fill: #E0263D;
 }

 .goal-box-container.rc-1 .reported.yes .bg {
     fill: #E0263D;
 }

 .goal-box-container.rc-1 .reported.yes .border {
     fill: #E0263D;
 }

 .goal-box-container.rc-1 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 2 */

 .goal-indicator-box-2-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-2-new.svg);
 }

 .goal-indicator-box-2-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-2-empty.svg);
 }

 .goal-indicator-box-2-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-2-bg.svg);
 }

 .goal-indicator-box-2-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-2-bg.svg);
 }

 .goal-box-container.rc-2 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-2 .reported.no .border {
     fill: #D8A238;
 }

 .goal-box-container.rc-2 .reported.no .sign {
     fill: #D8A238;
 }

 .goal-box-container.rc-2 .reported.yes .bg {
     fill: #D8A238;
 }

 .goal-box-container.rc-2 .reported.yes .border {
     fill: #D8A238;
 }

 .goal-box-container.rc-2 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 3 */

 .goal-indicator-box-3-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-3-new.svg);
 }

 .goal-indicator-box-3-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-3-empty.svg);
 }

 .goal-indicator-box-3-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-3-bg.svg);
 }

 .goal-indicator-box-3-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-3-bg.svg);
 }

 .goal-box-container.rc-3 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-3 .reported.no .border {
     fill: #4C9A45;
 }

 .goal-box-container.rc-3 .reported.no .sign {
     fill: #4C9A45;
 }

 .goal-box-container.rc-3 .reported.yes .bg {
     fill: #4C9A45;
 }

 .goal-box-container.rc-3 .reported.yes .border {
     fill: #4C9A45;
 }

 .goal-box-container.rc-3 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 4 */

 .goal-indicator-box-4-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-4-new.svg);
 }

 .goal-indicator-box-4-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-4-empty.svg);
 }

 .goal-indicator-box-4-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-4-bg.svg);
 }

 .goal-indicator-box-4-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-4-bg.svg);
 }

 .goal-box-container.rc-4 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-4 .reported.no .border {
     fill: #C0202F;
 }

 .goal-box-container.rc-4 .reported.no .sign {
     fill: #C0202F;
 }

 .goal-box-container.rc-4 .reported.yes .bg {
     fill: #C0202F;
 }

 .goal-box-container.rc-4 .reported.yes .border {
     fill: #C0202F;
 }

 .goal-box-container.rc-4 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 5 */

 .goal-indicator-box-5-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-5-new.svg);
 }

 .goal-indicator-box-5-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-5-empty.svg);
 }

 .goal-indicator-box-5-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-5-bg.svg);
 }

 .goal-indicator-box-5-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-5-bg.svg);
 }

 .goal-box-container.rc-5 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-5 .reported.no .border {
     fill: #EF402C;
 }

 .goal-box-container.rc-5 .reported.no .sign {
     fill: #EF402C;
 }

 .goal-box-container.rc-5 .reported.yes .bg {
     fill: #EF402C;
 }

 .goal-box-container.rc-5 .reported.yes .border {
     fill: #EF402C;
 }

 .goal-box-container.rc-5 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 6 */

 .goal-indicator-box-6-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-6-new.svg);
 }

 .goal-indicator-box-6-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-6-empty.svg);
 }

 .goal-indicator-box-6-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-6-bg.svg);
 }

 .goal-indicator-box-6-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-6-bg.svg);
 }

 .goal-box-container.rc-6 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-6 .reported.no .border {
     fill: #29B9DE;
 }

 .goal-box-container.rc-6 .reported.no .sign {
     fill: #29B9DE;
 }

 .goal-box-container.rc-6 .reported.yes .bg {
     fill: #29B9DE;
 }

 .goal-box-container.rc-6 .reported.yes .border {
     fill: #29B9DE;
 }

 .goal-box-container.rc-6 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 7 */

 .goal-indicator-box-7-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-7-new.svg);
 }

 .goal-indicator-box-7-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-7-empty.svg);
 }

 .goal-indicator-box-7-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-7-bg.svg);
 }

 .goal-indicator-box-7-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-7-bg.svg);
 }

 .goal-box-container.rc-7 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-7 .reported.no .border {
     fill: #F6BE17;
 }

 .goal-box-container.rc-7 .reported.no .sign {
     fill: #F6BE17;
 }

 .goal-box-container.rc-7 .reported.yes .bg {
     fill: #F6BE17;
 }

 .goal-box-container.rc-7 .reported.yes .border {
     fill: #F6BE17;
 }

 .goal-box-container.rc-7 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 8 */

 .goal-indicator-box-8-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-8-new.svg);
 }

 .goal-indicator-box-8-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-8-empty.svg);
 }

 .goal-indicator-box-8-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-8-bg.svg);
 }

 .goal-indicator-box-8-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-8-bg.svg);
 }

 .goal-box-container.rc-8 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-8 .reported.no .border {
     fill: #9E1C43;
 }

 .goal-box-container.rc-8 .reported.no .sign {
     fill: #9E1C43;
 }

 .goal-box-container.rc-8 .reported.yes .bg {
     fill: #9E1C43;
 }

 .goal-box-container.rc-8 .reported.yes .border {
     fill: #9E1C43;
 }

 .goal-box-container.rc-8 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 9 */

 .goal-indicator-box-9-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-9-new.svg);
 }

 .goal-indicator-box-9-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-9-empty.svg);
 }

 .goal-indicator-box-9-empty .goal-name {
     font-size: 17px;
     line-height: 1.1em;
 }

 .goal-indicator-box-9-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-9-bg.svg);
 }

 .goal-indicator-box-9-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-9-bg.svg);
 }

 .goal-box-container.rc-9 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-9 .reported.no .border {
     fill: #F26A29;
 }

 .goal-box-container.rc-9 .reported.no .sign {
     fill: #F26A29;
 }

 .goal-box-container.rc-9 .reported.yes .bg {
     fill: #F26A29;
 }

 .goal-box-container.rc-9 .reported.yes .border {
     fill: #F26A29;
 }

 .goal-box-container.rc-9 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 10 */

 .goal-indicator-box-10-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-10-new.svg);
 }

 .goal-indicator-box-10-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-10-empty.svg);
 }

 .goal-indicator-box-10-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-10-empty .goal-name {
     left: 50px;
 }

 .goal-indicator-box-10-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-10-bg.svg);
 }

 .goal-indicator-box-10-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-10-bg.svg);
 }

 .goal-box-container.rc-10 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-10 .reported.no .border {
     fill: #D71968;
 }

 .goal-box-container.rc-10 .reported.no .sign {
     fill: #D71968;
 }

 .goal-box-container.rc-10 .reported.yes .bg {
     fill: #D71968;
 }

 .goal-box-container.rc-10 .reported.yes .border {
     fill: #D71968;
 }

 .goal-box-container.rc-10 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 11 */

 .goal-indicator-box-11-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-11-new.svg);
 }

 .goal-indicator-box-11-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-11-empty.svg);
 }

 .goal-indicator-box-11-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-11-empty .goal-name {
     left: 51px;
 }

 .goal-indicator-box-11-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-11-bg.svg);
 }

 .goal-indicator-box-11-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-11-bg.svg);
 }

 .goal-box-container.rc-11 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-11 .reported.no .border {
     fill: #F89926;
 }

 .goal-box-container.rc-11 .reported.no .sign {
     fill: #F89926;
 }

 .goal-box-container.rc-11 .reported.yes .bg {
     fill: #F89926;
 }

 .goal-box-container.rc-11 .reported.yes .border {
     fill: #F89926;
 }

 .goal-box-container.rc-11 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 12 */

 .goal-indicator-box-12-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-12-new.svg);
 }

 .goal-indicator-box-12-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-12-empty.svg);
 }

 .goal-indicator-box-12-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-12-empty .goal-name {
     left: 57px;
 }

 .goal-indicator-box-12-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-12-bg.svg);
 }

 .goal-indicator-box-12-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-12-bg.svg);
 }

 .goal-box-container.rc-12 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-12 .reported.no .border {
     fill: #BA872D;
 }

 .goal-box-container.rc-12 .reported.no .sign {
     fill: #BA872D;
 }

 .goal-box-container.rc-12 .reported.yes .bg {
     fill: #BA872D;
 }

 .goal-box-container.rc-12 .reported.yes .border {
     fill: #BA872D;
 }

 .goal-box-container.rc-12 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 13 */

 .goal-indicator-box-13-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-13-new.svg);
 }

 .goal-indicator-box-13-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-13-empty.svg);
 }

 .goal-indicator-box-13-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-13-empty .goal-name {
     left: 50px;
 }

 .goal-indicator-box-13-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-13-bg.svg);
 }

 .goal-indicator-box-13-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-13-bg.svg);
 }

 .goal-box-container.rc-13 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-13 .reported.no .border {
     fill: #407F44;
 }

 .goal-box-container.rc-13 .reported.no .sign {
     fill: #407F44;
 }

 .goal-box-container.rc-13 .reported.yes .bg {
     fill: #407F44;
 }

 .goal-box-container.rc-13 .reported.yes .border {
     fill: #407F44;
 }

 .goal-box-container.rc-13 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 14 */

 .goal-indicator-box-14-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-14-new.svg);
 }

 .goal-indicator-box-14-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-14-empty.svg);
 }

 .goal-indicator-box-14-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-14-empty .goal-name {
     left: 50px;
 }

 .goal-indicator-box-14-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-14-bg.svg);
 }

 .goal-indicator-box-14-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-14-bg.svg);
 }

 .goal-box-container.rc-14 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-14 .reported.no .border {
     fill: #1992D1;
 }

 .goal-box-container.rc-14 .reported.no .sign {
     fill: #1992D1;
 }

 .goal-box-container.rc-14 .reported.yes .bg {
     fill: #1992D1;
 }

 .goal-box-container.rc-14 .reported.yes .border {
     fill: #1992D1;
 }

 .goal-box-container.rc-14 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 15 */

 .goal-indicator-box-15-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-15-new.svg);
 }

 .goal-indicator-box-15-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-15-empty.svg);
 }

 .goal-indicator-box-15-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-15-empty .goal-name {
     left: 50px;
 }

 .goal-indicator-box-15-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-15-bg.svg);
 }

 .goal-indicator-box-15-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-15-bg.svg);
 }

 .goal-box-container.rc-15 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-15 .reported.no .border {
     fill: #58B947;
 }

 .goal-box-container.rc-15 .reported.no .sign {
     fill: #58B947;
 }

 .goal-box-container.rc-15 .reported.yes .bg {
     fill: #58B947;
 }

 .goal-box-container.rc-15 .reported.yes .border {
     fill: #58B947;
 }

 .goal-box-container.rc-15 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 16 */

 .goal-indicator-box-16-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-16-new.svg);
 }

 .goal-indicator-box-16-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-16-empty.svg);
 }

 .goal-indicator-box-16-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-16-empty .goal-name {
     left: 57px;
     font-size: 14px;
     line-height: 1.1em;
     top: 17px;
 }

 .goal-indicator-box-16-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-16-bg.svg);
 }

 .goal-indicator-box-16-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-16-bg.svg);
 }

 .goal-box-container.rc-16 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-16 .reported.no .border {
     fill: #026999;
 }

 .goal-box-container.rc-16 .reported.no .sign {
     fill: #026999;
 }

 .goal-box-container.rc-16 .reported.yes .bg {
     fill: #026999;
 }

 .goal-box-container.rc-16 .reported.yes .border {
     fill: #026999;
 }

 .goal-box-container.rc-16 .reported.yes .sign {
     fill: #f4f4f4;
 }


 /* goal box 17 */

 .goal-indicator-box-17-default {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-17-new.svg);
 }

 .goal-indicator-box-17-empty {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/icons_goal-17-empty.svg);
 }

 .goal-indicator-box-17-empty .goal-number {
     left: 10px;
 }

 .goal-indicator-box-17-empty .goal-name {
     left: 57px;
 }

 .goal-indicator-box-17-indicators {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-17-bg.svg);
 }

 .goal-indicator-box-17-reported {
     background-image: url(/site/themes/sdg/imgs/country_city_datas/icons/indicator-reported-17-bg.svg);
 }

 .goal-box-container.rc-17 .reported.no .bg {
     fill: #f4f4f4;
 }

 .goal-box-container.rc-17 .reported.no .border {
     fill: #18496B;
 }

 .goal-box-container.rc-17 .reported.no .sign {
     fill: #18496B;
 }

 .goal-box-container.rc-17 .reported.yes .bg {
     fill: #18496B;
 }

 .goal-box-container.rc-17 .reported.yes .border {
     fill: #18496B;
 }

 .goal-box-container.rc-17 .reported.yes .sign {
     fill: #f4f4f4;
 }

 p.intro_text {
     font-family: PlantinMTPro-Regular, Georgia, serif !important;
 }

 #disaggregation_select_container {
     margin-left: 45px;
 }

 .multiselect-blue {
     overflow: visible;
 }

 .chosen-container-multi .chosen-choices {
     background: transparent !important;
     color: #fff;
     padding: 6px 8px 6px !important;
     border: none !important;
 }

 #city_select_chosen {
     width: 100% !important;
 }

 .chosen-container .chosen-drop {
     background-color: #003567 !important;
     color: #fff !important;
 }

 .chosen-container .chosen-results {
     color: #fff !important;
 }

 .chosen-container-multi .chosen-drop .result-selected {
     color: #666 !important;
 }

 .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
     background: url("/site/themes/sdg/imgs/country_city_datas/chosen-sprite.png") -42px 1px !important;
 }

 .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
     font-family: "proxima-nova-alt", Arial, Helvetica Neue, Helvetica, sans-serif !important;
     font-weight: 700;
     text-transform: uppercase;
     color: #fff !important;
 }

 .chosen-container-active .chosen-choices li.search-field input[type="text"] {
     color: #fff !important;
 }

 .goal-box-pagenum {
     display: inline-block;
     margin: 10px 15px 0px 15px;
     color: #003567;
 }

 .all_countries_popularity_icon {
     float: none !important;
 }
 .table.goal-table thead tr th {
     padding: 5px;
 }

 .table.goal-table thead tr th:last-child {
     float: left;
 }


/******************************
 * 480px es az alatt *
 ******************************/

@media (max-width: 480px) {
    .select-country .select-blue {
        margin: 0 0 10px -10px;
    }
    .absolute-center {
        width: 100%;
        margin: auto;
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
    }
    .separator {
        display: none;
    }
    section.indicator-legend .border-bottom-1px {
        border-bottom: 1px solid #fff;
    }
    section.indicator-legend .datas {
        margin-top: 10px;
    }
    section.select-a-goal-2 .select-blue {
        margin: 0 0 10px;
    }
    .select-blue {
        margin: 0 0 10px -15px;
    }
    section.select-country-help {
        text-align: left;
    }
    .carousel-container {
        text-align: center;
        position: relative;
    }
    .carousel-container .carousel {
        position: relative;
    }
    .carousel-container .carousel .carousel-control {
        background-image: none;
        position: relative;
        width: 20px;
        color: #fff;
        text-align: center;
        filter: alpha(opacity=50);
        opacity: 0.5;
    }
    .carousel-container .carousel .carousel-control.right {
    	left: -10%;
    }
    .carousel-container .carousel .carousel-control.left {
    	left: -10%;
    }    
    .carousel-container .carousel .carousel-control .carousel-arrow {
        width: 9px;
        height: 27px;
        display: inline-block;
        position: absolute;
        top: 200%;
        margin-top: -25px;
    }
    .carousel-container .carousel .carousel-control.left .carousel-arrow {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-left.png");
        background-size: contain;
        left: -30px;
    }
    .carousel-container .carousel .carousel-control.right .carousel-arrow {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-right.png");
        right: -30px;
        background-size: contain;
    }
    .carousel-container .carousel .carousel-inner {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .carousel-container .carousel .carousel-inner .item {
        opacity: 0;
        -webkit-transition-property: opacity;
        -moz-transition-property: opacity;
        -o-transition-property: opacity;
        transition-property: opacity;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        padding-left: 10px;
    }
    .carousel-container .carousel .carousel-inner .item .goal-box-container {
        padding: 6px;
        width: 44%;
        float: left;
        margin-left: 5px;
    }
    .carousel-container .carousel .carousel-inner .item .top-indicators {
        background-color: #eb1c2e;
        padding: 2px 4px;
        color: #fff;
        font-size: 14px;
        margin-left: -10px;
    }
    .carousel-container .carousel .carousel-inner .active {
        opacity: 1;
    }
    .carousel-container .carousel .carousel-inner .active.left, .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .active.right {
        left: 0;
        opacity: 0;
        z-index: 1;
    }
    .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .prev.right, .carousel-container .carousel .carousel-inner .next.left {
        opacity: 1;
    }
    .select-blue {
        margin: 0 0 10px 4px;
    }

    .indicator-legend-left {
        padding-left: 30px;
        padding-right: 30px;
    }

    .equal-heights.datas {
        padding-left: 40px;
        padding-right: 30px;
    }

    .border-bottom-1px {
        margin: 0px ;
    }

    .select-a-goal-wrapper {
        padding-right: 0px;
    }

    .select-goal-paragraph p {
        margin-top: 0.75em !important;
    }

    .select-country .select-blue {
        margin-left: -13px ;
    }

    .select-goal-paragraph {
        padding-left: 0px ;
    }

    #indicator_legend_all_countries_2 .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .indicator-table {
        padding-left: 30px;
        padding-right: 30px;
    }

    .one-country-goal-select-wrapper {
        padding-left: 30px ;
        padding-right: 0px ;
    }

    #disaggregation_select_container {
        padding-left: 30px !important;
        padding-right: 0px;
    }

    #indicator_legend_one_country_2 .container, #indicator_table_one_country .container, #indicator_table_all_countries .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .onecountry-datas-explore {
        padding-left: 30px !important; ;
    }

    .select-country-and-cities .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .city-indicator-select-wrapper {
        margin-left: 15px ;
        margin-right: 15px ;
    }

    .select-a-goal-city .selector-wrapper, .goal_table_wrapper{
        padding-left:15px;
        padding-right: 15px;
    }

    .select-a-goal-city p {
        margin-left: 10px ;
    }

    .select-blue {
        margin-left:0px;
    }

    .carousel-container .carousel .carousel-control.left .carousel-arrow {
        left: -35px;
    }
    .carousel-container .carousel .carousel-control.right .carousel-arrow {
        right: -40px;
    }
    .carousel-container .carousel .carousel-inner {
        margin-bottom: 15px;
    }

    .top-section .top-section-hero h1 {
        font-size: 26px;
    }

    .top-section .top-section-hero p {
        font-size: 20px;
    }

    .country-selector .country-selector-wrapper {
        padding-left: 0px;
        padding-right: 7px;
    }

    .country-selector .select-blue {
        margin-left: 0px;
    }

}


/******************************
 * 481px felett               *
 ******************************/
@media only screen and (min-width: 481px) {
    #one-country-goal-select, #one-country-disaggregation-select {
        margin-bottom: 0px;
    }
}
/******************************
 * 481-750px /helyett 768px *
 ******************************/

@media only screen and (min-width: 481px) and (max-width: 750px) {
    .select-country .select-blue {
        margin: 0 0 10px;
    }
    section.select-country-help {
        text-align: left;
    }
    .separator {
        display: none;
    }
    section.indicator-legend .border-bottom-1px {
        border-bottom: 1px solid #fff;
    }
    section.indicator-legend .datas {
        margin-top: 10px;
    }
    section.select-a-goal-2 .select-blue {
        margin: 0 0 10px;
    }
    .select-blue {
        margin: 0 0 10px -15px;
    }
    .absolute-center {
        width: 100%;
        margin: auto;
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
    }
    .carousel-container {
        text-align: center;
        position: relative;
    }
    .carousel-container .carousel {
        position: relative;
    }
    .carousel-container .carousel .carousel-control {
        background-image: none;
        position: relative;
        width: 20px;
        color: #fff;
        text-align: center;
        filter: alpha(opacity=50);
        opacity: 0.5;
    }
    .carousel-container .carousel .carousel-control .carousel-arrow {
        width: 9px;
        height: 27px;
        display: inline-block;
        position: absolute;
        top: 200%;
        margin-top: -25px;
    }
    .carousel-container .carousel .carousel-control.left .carousel-arrow {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-left.png");
        background-size: contain;
        left: -30px;
    }
    .carousel-container .carousel .carousel-control.right .carousel-arrow {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-right.png");
        right: -30px;
        background-size: contain;
    }
    .carousel-container .carousel .carousel-inner {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .carousel-container .carousel .carousel-inner .item {
        opacity: 0;
        -webkit-transition-property: opacity;
        -moz-transition-property: opacity;
        -o-transition-property: opacity;
        transition-property: opacity;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        padding-left: 10px;
    }
    .carousel-container .carousel .carousel-inner .item .goal-box-container {
        padding: 6px;
        width: 24%;
        float: left;
        margin-left: 0;
    }
    .carousel-container .carousel .carousel-inner .item .top-indicators {
        background-color: #eb1c2e;
        padding: 2px 4px;
        color: #fff;
        font-size: 14px;
        margin-left: -10px;
    }
    .carousel-container .carousel .carousel-inner .active {
        opacity: 1;
    }
    .carousel-container .carousel .carousel-inner .active.left, .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .active.right {
        left: 0;
        opacity: 0;
        z-index: 1;
    }
    .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .prev.right, .carousel-container .carousel .carousel-inner .next.left {
        opacity: 1;
    }
    .country-selector-wrapper {
        padding-left: 0px;
    }

    .indicator-legend-left {
        padding-left: 30px;
        padding-right: 30px;
    }

    .equal-heights.datas {
        padding-left: 40px;
        padding-right: 30px;
    }

    .border-bottom-1px {
        margin: 0px ;
    }

    .select-a-goal-wrapper, .no_indicators_wrapper {
        padding-left: 0px;
        padding-right: 0px;
    }

    .select-goal-paragraph p {
        margin-top: 0.75em !important;
    }

    #indicator_legend_all_countries_2 .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .one-country-goal-select-wrapper {
        padding-left: 30px;
    }

    #disaggregation_select_container {
        padding-left: 30px !important;
    }

    #indicator_legend_one_country_2 .container, #indicator_table_one_country .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .indicator-table {
        padding-left: 30px;
        padding-right: 30px;
    }

    .select-country-and-cities .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .city-indicator-select-wrapper {
        margin-left: 15px ;
        margin-right: 15px ;
    }

    .select-a-goal-city .selector-wrapper, .goal_table_wrapper{
        padding-left:15px;
        padding-right: 15px;
    }

    .select-a-goal-city p {
        margin-left: 10px ;
    }

    .carousel-container .carousel .carousel-control {
        left:-22px;
    }

    .goal-number {
        font-size: 40px;
        left: 10px;
        top: 2px;
    }
    .goal-number-small {
        font-size: 24px;
        left: 20px;
        top: 5px;
    }
    .goal-name {
        font-size: 15px;
        text-align: left;
        line-height: 16px;
        top: 12px;
        left: 33px;
    }
    .goal-name-small {
        font-size: 11px;
        text-align: left;
        line-height: 1em;
        top: 15px;
        left: 49px;
    }

    .goal-indicator-box-9-empty .goal-name {
        font-size: 14px;
        line-height: 1.15em;
    }

    .goal-indicator-box-11-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-11-empty .goal-name {
        font-size: 14px;
        line-height: 1.15em;
        left: 45px;
        top: 12px;
    }

    .goal-indicator-box-12-empty .goal-name {
        font-size: 15px;
        line-height: 1.1em;
        left: 45px;
        top: 12px;
    }

    .goal-indicator-box-12-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-name {
        font-size: 13px;
        line-height: 13px;
        left: 45px;
        top: 12px;
    }

    .goal-indicator-box-17-empty .goal-name {
        left: 50px;
    }
}


/******************************
 * 751px - 970px *
 ******************************/

@media only screen and (min-width: 751px) and (max-width: 970px) {
    .select-country .select-blue {
        margin: 0 0 10px;
    }
    section.select-country-help {
        text-align: left;
    }
    .separator {
        display: none;
    }
    section.select-a-goal-2 .select-blue {
        margin: 0 0 10px;
    }
    .select-blue {
        margin: 0 0 10px -15px;
    }
    section.indicator-legend .border-bottom-1px {
        border-bottom: 1px solid #fff;
    }
    section.indicator-legend .datas {
        margin-top: 10px;
    }
    .absolute-center {
        width: 100%;
        margin: auto;
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
    }
    .carousel-container {
        text-align: center;
        position: relative;
    }
    .carousel-container .carousel {
        position: relative;
    }
    .carousel-container .carousel .carousel-control {
        background-image: none;
        position: relative;
        width: 20px;
        color: #fff;
        text-align: center;
        filter: alpha(opacity=50);
        opacity: 0.5;
    }
    .carousel-container .carousel .carousel-control .carousel-arrow {
        width: 9px;
        height: 27px;
        display: inline-block;
        position: absolute;
        top: 200%;
        margin-top: -25px;
    }
    .carousel-container .carousel .carousel-control.left .carousel-arrow {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-left.png");
        background-size: contain;
        left: -30px;
    }
    .carousel-container .carousel .carousel-control.right .carousel-arrow {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/carousel-arrow-right.png");
        right: -30px;
        background-size: contain;
    }
    .carousel-container .carousel .carousel-inner {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .carousel-container .carousel .carousel-inner .item {
        opacity: 0;
        -webkit-transition-property: opacity;
        -moz-transition-property: opacity;
        -o-transition-property: opacity;
        transition-property: opacity;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        padding-left: 10px;
    }
    .carousel-container .carousel .carousel-inner .item .goal-box-container {
        padding: 6px;
        width: 24%;
        float: left;
        margin-left: 0;
    }
    .carousel-container .carousel .carousel-inner .item .top-indicators {
        background-color: #eb1c2e;
        padding: 2px 4px;
        color: #fff;
        font-size: 14px;
        margin-left: -10px;
    }
    .carousel-container .carousel .carousel-inner .active {
        opacity: 1;
    }
    .carousel-container .carousel .carousel-inner .active.left, .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .active.right {
        left: 0;
        opacity: 0;
        z-index: 1;
    }
    .carousel-container .carousel .carousel-inner .carousel-fade .carousel-inner .prev.right, .carousel-container .carousel .carousel-inner .next.left {
        opacity: 1;
    }
    .select-blue {
        margin: 0 0 10px 30px;
    }

    .city-indicator-select-wrapper .select-blue {
        margin-left: 15px;
    }

    .city-indicator-select-wrapper {
        padding-left: 0px;
    }

    .city-indicator-select-wrapper .multiselect-blue {
        margin-left: 0px;
    }

    .select-country .select-blue {
        margin-left:30px;
    }

    #disaggregation_select_container {
        margin-left: 60px;
    }

    .indicator-legend-left {
        padding-left:0px;
    }

    .select-goal-paragraph {
        margin-left: 30px ;
    }

    .indicator-table {
        padding-left: 0px ;
    }

    .one-country-select-a-goal-paragraph {
        padding-left: 0px ;
    }

    .one-country-goal-select-wrapper {
        padding-left: 0px;
    }

    .goal_table_wrapper {
        margin-left: 30px;
    }

    .carousel-container .carousel .carousel-inner {
        width: 100%;
        padding-left: 32px;
        padding-right: 30px;
    }

    .carousel-container .carousel .carousel-control {
        background-image: none;
        position: absolute;
        top: 0;
        bottom: 0;
        width: 20px;
        color: #fff;
        text-align: center;
        filter: alpha(opacity=50);
        opacity: 0.5;
    }

    .carousel-control.right {
        right: 0;
        left: auto;
        background-repeat: repeat-x;
    }

    .carousel-container .carousel .carousel-control .carousel-arrow {
        width: 17px;
        height: 30px;
        display: inline-block;
        position: absolute;
        top: 53%;
        margin-top: -25px;
        background-repeat: no-repeat;
    }

    .carousel-container .carousel .carousel-control.left .carousel-arrow {
        left: 0px;
    }

    .carousel-container .carousel .carousel-control.right .carousel-arrow {
        right:0px;
    }

    .goal-column-container {
        margin-right: 5px;
        margin-left: 5px;
    }

    .goal-box-container a {
    /*        background-size: 92% !important;*/
        background-position-x: center;
        background-position-y: bottom;
    }

    .goal-number {
        font-size: 40px;
        left: 10px;
        top: 2px;
    }
    .goal-number-small {
        font-size: 24px;
        left: 20px;
        top: 5px;
    }
    .goal-name {
        font-size: 15px;
        text-align: left;
        line-height: 16px;
        top: 12px;
        left: 33px;
    }
    .goal-name-small {
        font-size: 11px;
        text-align: left;
        line-height: 1em;
        top: 15px;
        left: 49px;
    }

    .goal-indicator-box-9-empty .goal-name {
        font-size: 14px;
        line-height: 1.15em;
    }

    .goal-indicator-box-11-empty .goal-number {
             left: 8px;
         }

    .goal-indicator-box-11-empty .goal-name {
        font-size: 14px;
        line-height: 1.15em;
        left: 45px;
        top: 12px;
    }

    .goal-indicator-box-12-empty .goal-name {
        font-size: 15px;
        line-height: 1.1em;
        left: 45px;
        top: 12px;
    }

    .goal-indicator-box-12-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-name {
        font-size: 13px;
        line-height: 13px;
        left: 45px;
        top: 12px;
    }

    .goal-indicator-box-17-empty .goal-name {
        left: 50px;
    }



    .separator {
        display: block;
    }

    section.indicator-legend .datas {
        padding-top: 15px;
    }

    section.indicator-legend .onecountry-datas {
        padding-top: 0px;
    }

    section.indicator-legend .onecountry-datas-explore {
        padding-top: 0px;
        margin-top: 0px;
    }

    section.indicator-legend .border-bottom-1px {
        border-bottom: none;
    }


}

@media only screen and (max-width: 970px) {
    .bkg.show-bkg {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/bkg-xl-tablet.jpg");
    }

    .bkg.show-bkg.bkg-cities {
        background-image: url("/site/themes/sdg/imgs/country_city_datas/bkg-xl-canada-tablet.jpg");
    }

    table.table-report thead tr th {
        padding-right: 15px;
    }

}

@media only screen and (min-width: 971px) and (max-width: 1170px) {
    #disaggregation_select_container {
        margin-left: 30px;
    }
}
@media only screen and (min-width: 970px) {
    .how-to-navigate-right {
        padding-top: 32px;
    }

    .country-selector .select-blue {
        margin-left: 20px;
    }

    .select-blue.offset {
        margin-left: 20px;
    }

    .select-country .select-blue {
        margin-left: 20px;
    }

    #disaggregation_select_container .select-blue {
        margin-left: 0px;
    }

    .indicator-legend-left {
        padding-left: 50px ;
    }

    .indicator-table {
        padding-left: 50px ;
    }

    .select-goal-paragraph {
        margin-left: 30px ;
    }

    .select-a-goal-2 {
        margin-left: 55px;
    }

    .select-a-goal-city .selector-wrapper, .select-a-goal-city .paragraph-wrapper, .goal_table_wrapper{
        padding-left:30px;
    }

    .carousel-inner {
        padding-left: 34px !important;
    }

    .goal-number {
        font-size: 45px;
        left: 12px;
        top: 2px;
    }
    .goal-number-small {
        font-size: 24px;
        left: 20px;
        top: 5px;
    }
    .goal-name {
        font-size: 18px;
        text-align: left;
        line-height: 1em;
        top: 12px;
        left: 37px;
    }
    .goal-name-small {
        font-size: 11px;
        text-align: left;
        line-height: 1em;
        top: 15px;
        left: 49px;
    }

    .city-goal-select {
        margin-left:15px;
    }
}

@media only screen and (max-width: 450px) {
    #explore-table-too-small-display {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 15px;
    }

    .carousel-container .carousel .carousel-control {
        left:-40px;
    }

    .goal-number {
        font-size: 40px;
        left: 10px;
        top: 0px;
    }
    .goal-number-small {
        font-size: 24px;
        left: 20px;
        top: 5px;
    }
    .goal-name {
        font-size: 15px;
        text-align: left;
        line-height: 16px;
        top: 10px;
        left: 33px;
    }
    .goal-name-small {
        font-size: 11px;
        text-align: left;
        line-height: 1em;
        top: 15px;
        left: 49px;
    }

    .goal-indicator-box-9-empty .goal-name {
        font-size: 14px;
        line-height: 1.15em;
    }

    .goal-indicator-box-11-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-11-empty .goal-name {
        font-size: 14px;
        line-height: 1.15em;
        left: 45px;
        top: 10px;
    }

    .goal-indicator-box-12-empty .goal-name {
        font-size: 15px;
        line-height: 1.1em;
        left: 45px;
        top: 10px;
    }

    .goal-indicator-box-12-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-name {
        font-size: 13px;
        line-height: 13px;
        left: 45px;
        top: 10px;
    }

    .goal-indicator-box-17-empty .goal-name {
        left: 50px;
    }
}
@media only screen and (max-width: 370px) {
    .goal-number {
        font-size: 35px;
        left: 8px;
        top: 0px;
    }
    .goal-number-small {
        font-size: 24px;
        left: 20px;
        top: 5px;
    }
    .goal-name {
        font-size: 14px;
        text-align: left;
        line-height: 14px;
        top: 9px;
        left: 27px;
    }
    .goal-name-small {
        font-size: 11px;
        text-align: left;
        line-height: 1em;
        top: 15px;
        left: 49px;
    }

    .goal-indicator-box-9-empty .goal-name {
        font-size: 12px;
        line-height: 1.15em;
    }

    .goal-indicator-box-10-empty .goal-name {
        left: 45px;
    }

    .goal-indicator-box-11-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-11-empty .goal-name {
        font-size: 12px;
        line-height: 1.15em;
        left: 45px;
        top: 9px;
    }

    .goal-indicator-box-12-empty .goal-name {
        font-size: 13px;
        line-height: 1em;
        left: 45px;
        top: 9px;
    }

    .goal-indicator-box-12-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-13-empty .goal-name {
        left: 45px;
    }

    .goal-indicator-box-14-empty .goal-name {
        left: 45px;
    }

    .goal-indicator-box-15-empty .goal-name {
        left: 45px;
    }

    .goal-indicator-box-16-empty .goal-number {
        left: 8px;
    }

    .goal-indicator-box-16-empty .goal-name {
        font-size: 11px;
        line-height: 11px;
        left: 45px;
        top: 9px;
    }

    .goal-indicator-box-17-empty .goal-name {
        left: 45px;
    }
}

@media only screen and (max-width: 412px) {
    .indicator-popularity-links {
        padding: 4px 10px;
    }

    .indicator-popularity-links a:link {
        font-size:10px;
    }

    .carousel-container .carousel .carousel-control {
        left: 41%;
    }

    .indicator-table-too-small {
        margin-top: 1.7em;
        margin-left: 30px;
        padding-left: 0px;
    }
}
@media only screen and (max-width: 345px) {
    .indicator-popularity-links {
        padding: 4px 4px;
    }

    .indicator-popularity-links a:link {
        font-size:9px;
    }

    .indicator-popularity-links span {
        margin: 0 0px;
    }
}
@media only screen and (max-width: 750px) {
    #disaggregation_select_container {
        margin-left: 0px;
    }

    table.table-report thead tr th {
        font-size: 90%;
        vertical-align: middle !important;
    }

    .flex-container-pager {
        line-height: 1.9;
    }

    .flex-item-name {
        float: left;
    }
}

/* css hacks - temporarily */
/* For safari and chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .chosen-container-multi .chosen-choices {
        padding: 5px 8px 4px !important;
    }
}

@media screen and (max-width: 480px) and (-webkit-min-device-pixel-ratio:0) {
    .carousel-container .carousel .carousel-control.right {
        left: 39% ;
        top: 30px ;
    }
    
    .carousel-container .carousel .carousel-control.left {
        left: 39% ;
        top: 30px ;
    }

    
    select,
    textarea,
    input {
        font-size: 16px !important;
    }
}

@media only screen and (max-width: 750px) and (min-width: 481px) and (-webkit-min-device-pixel-ratio:0) {
    .carousel-container .carousel .carousel-control.right {
        left: 50% ;
        top: 40px ;
    }
    
    .carousel-container .carousel .carousel-control.left {
        left: 50% ;
        top: 40px ;
    }
}

/* Only for safari */
@media only screen and (-webkit-min-device-pixel-ratio: 1) {
    ::i-block-chrome, .indicator-boxes-container img {
        margin-top: 14%;
    }
    ::i-block-chrome, .reported svg {
        height: 130% !important;
    }
    ::i-block-chrome, .goal-indicators-box {
        text-decoration: none !important;
    }

}


@media only screen and (-webkit-min-device-pixel-ratio: 1) and (min-width: 970px) {
/*    ::i-block-chrome, .goal-indicators-box {
        text-decoration: none !important;
    }*/
}