#menubutton_1,#menubutton_2,#menubutton_3,#menubutton_4,#menubutton_5 {
    width:19%;
}

#menubutton_1:hover, #menubutton_1.selected {
  background-color:#2db3c6;
}

#menubutton_2:hover, #menubutton_2.selected {
  background-color:#2db3c6;
}

#menubutton_3:hover, #menubutton_3.selected {
  background-color:#2db3c6;
}

#menubutton_4:hover, #menubutton_4.selected {
  background-color:#2db3c6;
}

#menubutton_5:hover, #menubutton_5.selected {
  background-color:#2db3c6;
}

.textcontainer {
  margin-left:auto;
  margin-right:auto;
}

#factboxtitle {
    background: none;
    color: white;
    text-transform: uppercase;
    font-weight: 800;
    font-size: 2vw;
    line-height: 3vw;
    height: 4vw;
    padding-left: 0vw;
    margin-left: 0vw;
}

ol {
    padding-inline-start: 20px;
}

.standout {
  margin:20px 0px;
  border-top:1px solid white;
  border-bottom:1px solid white;
  text-align:center;
  padding:15px 0px;
  font-weight:300;
  color:#fdfdfd;
}

.standout b {
  color:white;
  font-weight:700;
}

/* ANIMATION 1 */
#animation1 {
  width:100%;
  font-size:11px;
  background-color:white;
  border-radius:32px;
  position:relative;
  height:306px;
  margin-top:35px;
}

#anih0 {
  width:100%;
  height:45px;
  line-height:45px;
  text-align:center;
  font-size:1vw; 
}

#anih1,#anih2 {
  display:inline-block;
  width:50%;
  height:15px;
  line-height:15px;
  text-align:center;
  font-size:0.92vw;  
  color:#3ac3d7;
}

#anih3 {
  position:absolute;
  width:100%;
  height:30px;
  line-height:30px;
  text-align:center;
  font-size:0.92vw;  
  bottom:2px;
  color:#999999;
}

#ani1,#ani4 {
  position:absolute;
  width:50%;
  height:220px;
  top:60px;
  background-color:white;
  z-index:5;
}

#ani1 { left:0 }
#ani4 { right:0 }

#ani2 {
  position:absolute;
  top:45px;  
  width:100%;
  height:220px;
  z-index:2;
}

#ani1 table,#ani2 table, #ani4 table { height:100%;width:100%; }
#ani2 table > tbody > tr > td { padding:0px; font-size:10px;line-height:16px; }
#ani1 table > tbody > tr > td > img,#ani4 table > tbody > tr > td > img  {width:100%;max-width:138px;}

#ani_overlay {
  width:100%;
  position:absolute;
  z-index:50;
  height:305px;
}

#ani_overlay2 {
  width:100%;
  position:absolute;
  z-index:49;
  height:305px;
}

.g1_blackdot {
  border-radius:50%;
  height:2.5vw;
  width:2.5vw;
  line-height:2.083333vw;
  font-size:1.25vw;
  font-weight:800;
  text-align:center;
  color:white;
  border:0.25vw solid black;
  cursor:pointer;
  background-color:black;
  z-index:50;
}

#ol2,#ol3 {
  width:0%;
  padding:7px 0 0 0;
}

#ol1,#ol4 {
  width:50%;
  padding:20px 0;  
}

#ol2 {
  opacity:0;
  text-align:left;
}

#ol3 {
  opacity:0;
  text-align:right;
}

/* DONUT */

.svg-item {
    width: 100%;
    font-size: 16px;
    margin: 0 auto;
    animation: donutfade 1s;
}

@keyframes donutfade {
  /* this applies to the whole svg item wrapper */
    0% {
        opacity: .2;
    }
    100% {
        opacity: 1;
    }
}

.svg-item {
  max-width:90%;
  display:inline-block;
}

.donut-ring {
    stroke: #e3e3e3;
}

.donut-segment {
    transform-origin: center;
    stroke: #2db3c6;
}

.segment-1{fill:#e3e3e3;}
.segment-2{fill:#2db3c6;}

.donut-percent {
    animation: donutfadelong 1s;
}

.donut-segment-1 {
    stroke: #2db3c6;
    animation: donut1 3s;
}

.donut-segment-2 {
    stroke: #2db3c6;
    animation: donut2 3s;
}

.donut-segment-3 {
    stroke: #2db3c6;
    animation: donut3 3s;
}

.donut-segment-4 {
    stroke: #2db3c6;
    animation: donut4 3s;
}

.donut-segment-5 {
    stroke: #2db3c6;
    animation: donut5 3s;
}

.donut-segment-6 {
    stroke: #2db3c6;
    animation: donut6 3s;
}

.donut-segment-7 {
    stroke: #2db3c6;
    animation: donut7 3s;
}

.donut-text {
    font-family: Arial, Helvetica, sans-serif;
    fill: #2db3c6;
}

.donut-label {
    font-size: 0.28em;
    font-weight: 700;
    line-height: 1;
    fill: #000;
    transform: translateY(0.25em);
}

.donut-percent {
    font-size: 0.5em;
    line-height: 1;
    transform: translateY(0.5em);
    font-weight: bold;
}

.donut-data {
    font-size: 0.12em;
    line-height: 1;
    transform: translateY(0.5em);
    text-align: center;
    text-anchor: middle;
    color:#666;
    fill: #666;
    animation: donutfadelong 1s;
}


@keyframes donutfadelong {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes donut1 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 17, 83;
    }
}

@keyframes donut2 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 11, 89;
    }
}

@keyframes donut3 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 17, 83;
    }
}

@keyframes donut4 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 72, 28;
    }
}

@keyframes donut5 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 52, 48;
    }
}

@keyframes donut6 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 76, 24;
    }
}

@keyframes donut7 {
    0% {
        stroke-dasharray: 0, 100;
    }
    100% {
        stroke-dasharray: 72, 28;
    }
}

/* GRAPHS */

.graph1 {
 background-color:#addbdf;
}

.graph2 {
 background-color:#67c4d6;
}

.graph3 {
 background-color:#2db3c6;
}

.graph4 {
 background-color:#0d9da8;
}

.graph5 {
 background-color:#108e93;
}

.graph_vp_1 { z-index:10;margin-top:0; }
.graph_vp_2 { z-index:11;margin-top:2.5vw; }
.graph_vp_3 { z-index:12;margin-top:5vw; }
.graph_vp_4 { z-index:13;margin-top:7.5vw; }
.graph_vp_5 { z-index:14;margin-top:10vw; }

.graph_prelabel {
  height:5vw; /* 60px */
  border-top-right-radius:8px;
  border-bottom-right-radius:8px;
  color:white;
  padding:0.5vw 1vw ; /* 6px 24px */
  text-align:left;
  font-weight:700;
  font-size:1.2vw;   /* 18px */
  line-height:1.5vw; /* 18px */
  margin-left:5px;
  overflow:hidden;
  position:absolute;
  display:inline-block;
  left:15%;
}

.graph_start { 
  font-weight:600;
  padding-right:1vw;     /* 36px */
  font-size:1vw;         /* 21px */  
}

.graph_bar_m {
  height:5vw; /* 60px */
  border-top-right-radius:8px;
  border-bottom-right-radius:8px;
  color:white;
  padding:0.5vw 0.75vw ; /* 6px 9px */
  text-align:right;
  font-weight:700;
  font-size:1.5vw;   /* 18px */
  line-height:1.5vw; /* 18px */
  margin-left:5px;
  overflow:hidden;
  position:absolute;
  display:inline-block;
  left:15%;
}

.graph_bar_lowlabel {
  padding-top:3.0vw; /* 6px 9px */
}

.graph_bar {
  font-weight:700;
  font-size:1.5vw;   /* 18px */
  line-height:1.5vw !important; /* 18px */
  padding:0.5vw 0.75vw ; /* 6px 9px */
}

#graph_bar1 {
  width:10%;
}

.gm_1 {
 height:7.5vw;       /* 120px */
 line-height:7.5vw;  /* 120px */
}

.graph_bgbar_gm_1 {
  margin-top:-6.25vw; /* 138px */
}



.graphtitle_bigger {
  font-size:1.2vw !important;
  color:#2db3c6 !important;
}

.graphtitle_bigger > .smaller {
  font-size:1vw;
}

/* FLUID */

@media screen and (min-width: 1200px) {
  

#factboxtitle {
    background: none;
    color: white;
    text-transform: uppercase;
    font-weight: 800;
    font-size: 24px;
    line-height: 36px;
    height: 48px;
    padding-left: 0vw;
    margin-left: 0vw;
}


  
  .graphtitle_bigger {
    font-size:24px;
  }
  
  .graphtitle_bigger > .smaller {
    font-size:12px;
  }
  
  
  #anih0 {
    font-size:12px; 
  }

  #anih1,#anih2,#anih3 {
    font-size:11px;  
  }  
  
}