/* @override http://localhost/jdrfnetwork/wp-content/themes/jdrf-childrens-congress/lib/css/jdrf.css
	http://localhost/jdrfnetwork/cc/wp-content/themes/jdrf-childrens-congress/lib/css/jdrf.css */


.Infographic {
  margin: auto;
  font-family: Lato-Regular, sans-serif;
  font-weight: lighter;
  font-size: 14px;
  line-height: 1.4em;
  width: 100%;
  background: #ecf1f3;
  box-shadow: 1px 1px 10px #cddadf;
  -moz-box-shadow: 1px 1px 10px #cddadf;
  -webkit-box-shadow: 1px 1px 10px #cddadf;
  -o-box-shadow: 1px 1px 10px #cddadf;
  -ms-box-shadow: 1px 1px 10px #cddadf;
  color: #627681;
  text-align: center;
  padding: 0;
  background: transparent;
	box-shadow: none;
}

.Infographic input {
  background-color: white;
  border: 0px solid transparent;
  padding: 0.285714285714em;
  color: #627681;
}

.Infographic .input {
  background-color: white;
}

.Infographic a.button,
.Infographic a.button:hover {
  text-decoration: none;
}

.Infographic button,
.Infographic .button {
  font-family: Lato-Regular, sans-serif;
  font-weight: bold;
  -moz-transition-property: background-color,color,border-color;
  -webkit-transition-property: background-color,color,border-color;
  -o-transition-property: background-color,color,border-color;
  -ms-transition-property: background-color,color,border-color;
  -moz-transition-duration: 0.25s;
  -webkit-transition-duration: 0.25s;
  -o-transition-duration: 0.25s;
  -ms-transition-duration: 0.25s;
  border: 0px solid transparent;
  margin-left: 0.357142857143em;
  background-color: #3a75c4;
  cursor: pointer;
  color: white;
  box-shadow: 1px 1px 0px #2c5893;
  -moz-box-shadow: 1px 1px 0px #2c5893;
  -webkit-box-shadow: 1px 1px 0px #2c5893;
  -o-box-shadow: 1px 1px 0px #2c5893;
  -ms-box-shadow: 1px 1px 0px #2c5893;
  padding: 0.142857142857em;
  padding-left: 0.357142857143em;
  padding-right: 0.357142857143em;
  border-radius: 0.357142857143em;
  -moz-border-radius: 0.357142857143em;
  -webkit-border-radius: 0.357142857143em;
  -o-border-radius: 0.357142857143em;
  -ms-border-radius: 0.357142857143em;
  text-transform: uppercase;
}

.Infographic button .label,
.Infographic .button .label {
  font-size: 70%;
}

.Infographic button:hover,
.Infographic .button:hover {
  background-color: #6190d0;
}

.Infographic > .header h1 {
  color: transparent;
  background: url(../images/header.png) center center no-repeat;
  margin: auto;
  width: 50em;
  height: 14.5714285714em;
  margin-bottom: 1.57142857143em;
}

.Infographic > .header p {
  margin: auto;
  width: 47.8571428571em;
}

.highlight {
  color: var(--wp--preset--color--blue)
  font-weight: bold;
  font-size: 110%;
}

.section {
  clear: both;
  margin-top: 1.42857142857em;
  margin-bottom: 1.42857142857em;
}

.informative.section h2 {
  background: url(../images/heading-bg.png) center center no-repeat;
  color: white;
  font-size: 140%;
  padding: 0.5em;
  line-height: 1.25em;
}

.informative.section .icon {
  width: 33%;
  float: left;
}

.informative.section .icon .image {
  height: 122px;
  position: relative;
  margin-top: 1.42857142857em;
  margin-bottom: 0.714285714286em;
}

.informative.section .icon .image .is-gif,
.informative.section .icon .image .is-png {
  position: absolute;
  left: 50%;
  margin-left: -61px;
  z-index: 2;
}

.informative.section .icon .image .is-gif {
  z-index: 1;
}

.informative.section .icon .stat {
  text-transform: uppercase;
  font-family: Lato-Black;
  font-size: 120%;
  line-height: 1.15em;
  color: var(--wp--preset--color--blue)
}

.interactive.section {
  margin-top: 2.85714285714em;
  background-color: #7cb9e2;
  border-radius: 1.42857142857em;
  -moz-border-radius: 1.42857142857em;
  -webkit-border-radius: 1.42857142857em;
  -o-border-radius: 1.42857142857em;
  -ms-border-radius: 1.42857142857em;

}

.interactive.section h2 {
  position: relative;
  top: -1.35714285714em;
  background: url(../images/map-heading-bg.png) center center no-repeat;
  height: 4.42857142857em;
  margin: auto;

	display: none; 
}

.interactive.section h2 .head,
.interactive.section h2 .field,
.interactive.section h2 .tail {
  display: block;
  float: left;
}

.interactive.section h2 .head,
.interactive.section h2 .tail {
  width: 215px;
  color: white;
}

.interactive.section h2 .head .label,
.interactive.section h2 .tail .label {
  display: block;
  padding: 0.5em;
  font-size: 140%;
}

.interactive.section h2 .head {
  text-align: right;
}

.interactive.section h2 .head .label {
  padding-right: 0.510204081633em;
}

.interactive.section h2 .tail {
  width: 200px;
  text-align: left;
}

.interactive.section h2 .tail .label {
  padding-left: 0.510204081633em;
}

.interactive.section h2 .field {
  width: 310px;
  padding-top: 20px;
  position: relative;
}

.interactive.section h2 .field button.search {
  padding: 0.2em 0.7em;
}

.interactive.section h2 .field input {
  text-align: center;
  background-color: #e17920;
  border-top: 1px solid #be661b;
  border-left: 1px solid #be661b;
  width: 10em;
  font-family: Lato-Regular, sans-serif;
  font-size: 140%;
  font-weight: bold;
  color: white;
  text-transform: uppercase;
}

.interactive.section h2 .field input::-webkit-input-placeholder {
  color: white;
}

.interactive.section .wrap-content {
  height: 492px;
  overflow: hidden;
}

.interactive.section .wrap-content .tabs-content {
  position: relative;
}

.interactive.section .Map {
  padding-bottom: 2em;
	padding-top: 1em; 
}

.interactive.section .Map .state {
  fill: #d6e9f6;
  fill-opacity: 1;
  stroke: #7cb9e2;
  stroke-width: 0.58163458;
  stroke-miterlimit: 4;
  stroke-opacity: 1;
  stroke-dasharray: none;
}

.interactive.section .Map .highlighted,
.interactive.section .Map .highlighted path {
  stroke: #ffffff;
  fill: var(--wp--preset--color--blue);
}

.interactive.section .Map .tooltip {
  position: absolute;
  padding: 0.3em 0.7em;
  background-color: #3a75c4;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 120%;
  border-radius: 0.142857142857em;
  -moz-border-radius: 0.142857142857em;
  -webkit-border-radius: 0.142857142857em;
  -o-border-radius: 0.142857142857em;
  -ms-border-radius: 0.142857142857em;
}

.interactive.section .Map .tooltip .tip {
  background: url("../images/tip.png") no-repeat;
  position: absolute;
  left: 50%;
  width: 13px;
  height: 10px;
  bottom: -10px;
  margin-left: -6.5px;
}

.interactive.section .tabs {
  width: 32.1428571429em;
  margin: auto;
  margin-top: 0.714285714286em;
}

.interactive.section .tabs li {
  float: left;
  width: 33%;
}

.interactive.section .tabs li a {
  display: block;
  margin-left: -1px;
  -moz-transition-property: background-color,color;
  -webkit-transition-property: background-color,color;
  -o-transition-property: background-color,color;
  -ms-transition-property: background-color,color;
  -moz-transition-duration: 0.25s;
  -webkit-transition-duration: 0.25s;
  -o-transition-duration: 0.25s;
  -ms-transition-duration: 0.25s;
  padding: 0.714285714286em;
  background: #3a75c4;
  border: 1px solid #57a7f7;
  text-transform: uppercase;
  color: white;
  font-weight: bold;
  white-space: nowrap;
}

.interactive.section .tabs li a,
.interactive.section .tabs li a:active,
.interactive.section .tabs li a:visited,
.interactive.section .tabs li a:hover {
  text-decoration: none;
}

.interactive.section .tabs li a .label {
  font-size: 90%;
}

.interactive.section .tabs li.selected a,
.interactive.section .tabs li:hover a {
  background-color: white;
  border-bottom: 1px solid white;
  position: relative;
  z-index: 1;
  color: #57a7f7;
}

.interactive.section .content {
  clear: both;
  background-color: white;
  height: 32.2142857143em;
  position: relative;
}

.interactive.section .content .window {
  display: none;
  position: absolute;
  width: 100%;
}

.interactive.section .controls {
  position: absolute;
  width: 100%;
  bottom: 2px;
  padding-top: 0.714285714286em;
  padding-bottom: 0.714285714286em;
}

.interactive.section .controls .label {
  font-size: 80%;
  line-height: 1.25em;
}

.interactive.section .controls .next,
.interactive.section .controls .previous {
  position: absolute;
  text-transform: uppercase;
  -moz-transition-property: color;
  -webkit-transition-property: color;
  -o-transition-property: color;
  -ms-transition-property: color;
  -moz-transition-duration: 0.25s;
  -webkit-transition-duration: 0.25s;
  -o-transition-duration: 0.25s;
  -ms-transition-duration: 0.25s;
  color: #57a7f7;
  font-weight: bold;
}

.interactive.section .controls .next:hover,
.interactive.section .controls .previous:hover {
  color: #268df5;
}

.interactive.section .controls .previous {
  left: 0.714285714286em;
  background: url("../images/tip-previous.svg") no-repeat left 0.35em;
  padding-left: 1.07142857143em;
}

.interactive.section .controls .next {
  right: 0.714285714286em;
  background: url("../images/tip-next.svg") no-repeat right 0.35em;
  padding-right: 1.07142857143em;
}

.interactive.section .controls .button {
  padding: 0.357142857143em;
  padding-left: 1.07142857143em;
  padding-right: 1.07142857143em;
}

.ImpactSection,
.ResearchSection,
.TribalSection {
  overflow: hidden;
}

.ImpactSection .page-wrapper,
.ResearchSection .page-wrapper,
.TribalSection .page-wrapper {
  position: relative;
}

.ImpactSection .page,
.ResearchSection .page,
.TribalSection .page {
  width: 52.8571428571em;
  height: 28.5714285714em;
  float: left;
  position: relative;
}

.ImpactSection .group {
  margin: 0 3em;
  padding: 2.8em 0;
}

.ImpactSection .group .subgroup .icon {
  position: relative;
  width: 123px;
  height: 123px;
  float: left;
  padding-right: 1em;
  text-align: left;
}

.ImpactSection .group .subgroup .icon img.complement {
  position: relative;
  top: 20.5px;
  left: 20.5px;
}

.ImpactSection .group .subgroup .icon .graph {
  width: 122px;
  height: 122px;
  position: absolute;
  top: 0;
  left: 0;
}

.ImpactSection .group .subgroup .icon .graph .diagnosed-partial,
.ImpactSection .group .subgroup .icon .graph .poor-health-partial {
  fill: var(--wp--preset--color--blue)
  stroke: none;
  stroke-width: 0px;
}

.ImpactSection .group .subgroup .icon .graph .diagnosed-all,
.ImpactSection .group .subgroup .icon .graph .poor-health-all {
  fill: #3a75c4;
  stroke: none;
  stroke-width: 0px;
}

.ImpactSection .group .subgroup .text {
  text-align: left;
  padding-top: 1.5em;
}

.ImpactSection .group .subgroup .text .figure {
  display: block;
  color: var(--wp--preset--color--blue)
  font-family: Lato-Black, sans-serif;
  font-size: 200%;
  margin-bottom: 0.2em;
}

.ImpactSection .group.first {
  border-bottom: #57a7f7 1px solid;
}

.ResearchSection .banner {
  position: relative;
  margin-top: 2em;
}

.ResearchSection .banner .text {
  text-align: left;
  position: absolute;
  top: 27px;
  left: 368px;
  font-family: Lato-Bold, sans-serif;
  color: #3a75c4;
}

.ResearchSection .group {
  margin: 0 3.7em;
  padding: 1.2em 0;
  text-align: left;
}

.ResearchSection .group img {
  width: 75px;
}

.ResearchSection .group .title {
  margin-left: 13px;
  margin-right: 16px;
  color: #3a75c4;
  font-family: Lato-Bold, sans-serif;
}

.ResearchSection .group.N2 {
  border-top: #57a7f7 1px solid;
}

.TribalSection .banner {
  position: relative;
  margin-top: 2em;
}

.TribalSection .banner .text {
  text-align: left;
  position: absolute;
  top: 26px;
  left: 401px;
  font-family: Lato-Bold, sans-serif;
  color: var(--wp--preset--color--blue)
}

.TribalSection .blood-sugar,
.TribalSection .ldl {
  width: 41.9%;
  text-align: left;
  padding-top: 1.5em;
}

.TribalSection .blood-sugar {
  margin-left: 3.5em;
}

.TribalSection .blood-sugar .graph {
  right: 21px;
}

.TribalSection .ldl {
  margin-right: 3.5em;
}

.TribalSection .facts {
  width: 64%;
}

.TribalSection .facts .from-figure {
  color: #7cb9e2;
  font-family: Lato-Bold, sans-serif;
}

.TribalSection .facts .to-figure {
  color: var(--wp--preset--color--blue)
  font-family: Lato-Bold, sans-serif;
}

.TribalSection .graph {
  position: relative;
  top: 16px;
}

.TribalSection .graph .charts {
  height: 30px;
  border-bottom: 1px solid #7cb9e2;
  position: relative;
  width: 82px;
}

.TribalSection .graph .charts .chart {
  width: 20px;
  position: absolute;
  bottom: 0;
}

.TribalSection .graph .charts .chart.N1996,
.TribalSection .graph .charts .chart.N1998 {
  background-color: #7cb9e2;
  height: 40px;
  left: 14px;
}

.TribalSection .graph .charts .chart.N1998 {
  height: 47px;
}

.TribalSection .graph .charts .chart.N2011 {
  background-color: var(--wp--preset--color--blue)
  height: 30px;
  left: 50px;
}

.TribalSection .graph .years .year {
  display: inline-block;
  margin-left: 10px;
  font-size: 80%;
}

.TribalSection .benefits {
  background-color: #7cb9e2;
  border-radius: 0.357142857143em;
  -moz-border-radius: 0.357142857143em;
  -webkit-border-radius: 0.357142857143em;
  -o-border-radius: 0.357142857143em;
  -ms-border-radius: 0.357142857143em;
  color: white;
  padding: 0.7em;
  padding-bottom: 1em;
  margin-top: 3em;
  position: relative;
}

.TribalSection .benefits .text {
  font-family: Lato-Bold, sans-serif;
}

.TribalSection .benefits .figure {
  display: block;
  color: #3a75c4;
  font-size: 200%;
  font-family: Lato-Black, sans-serif;
  margin-top: 0.4em;
}

.TribalSection .benefits .tip {
  position: absolute;
  background: url("../images/tribal-tip.svg");
  width: 30px;
  height: 35px;
  top: -25px;
  left: 22px;
}

.sharing {
  margin-top: 0.714285714286em;
  margin-bottom: 0.714285714286em;
  background-color: #3a75c4;
  border-radius: 0.357142857143em;
  -moz-border-radius: 0.357142857143em;
  -webkit-border-radius: 0.357142857143em;
  -o-border-radius: 0.357142857143em;
  -ms-border-radius: 0.357142857143em;
  padding: 0 0.714285714286em 0.5em;
  color: white;
}

.sharing .label {
  text-transform: uppercase;
  font-family: Lato-Bold, sans-serif;
  font-family: 90%;
  padding-right: 0.214285714286em;
}

.sharing ul,
.sharing li {
  display: inline;
  margin: 0px;
  padding: 0px;
  margin-right: 0.357142857143em;
}

.sharing .links {
  margin-top: 0.8em;
  line-height: 1.64285714286em;
  float: left;
}

.sharing .links a {
  width: 28px;
  margin-right: 4px;
  display: block;
  color: transparent;
  float: right;
  position: relative;
  bottom: 0.2em;
  height: 27px;
}

.sharing .links .twitter a {
  background: url("../images/twitter-icon.png") 0 0 no-repeat;
}

.sharing .links .facebook a {
  background: url("../images/facebook-icon.png") 0 0 no-repeat;
}

.sharing .links .email a {
  background: url("../images/mail-icon.png") 0 0 no-repeat;
}

.sharing .url {
  margin-top: 0.8em;
  float: right;
}

.sharing .url input {
  background-color: #2c5893;
  line-height: 1.42857142857em;
  padding: 0.214285714286em;
}

.sharing .url button {
  background-color: #57a7f7;
}

.sharing .url button:hover {
  background-color: #6fb4f8;
}

.Legacy {
  background-color: white;
  text-align: center;
  padding: 3em;
}

.Legacy p {
  margin-bottom: 1.6em;
}

.Legacy h3 {
  color: var(--wp--preset--color--blue)
  text-transform: uppercase;
  font-family: Lato-Bold;
  font-size: 140%;
  margin-bottom: 1.6em;
}

.Legacy .button {
  background-color: #7cb9e2;
  color: white;
  position: relative;
  text-transform: uppercase;
  padding: 1em;
}

.Legacy .browsers a {
  display: block;
  margin-right: 20px;
  width: 25%;
}

.Legacy .browsers .browser {
  bottom: 0;
  font-size: 85%;
  display: block;
}

.Sources {
  text-align: left;
}

.Sources a {
  font-size: 80%;
  color: #627681;
  text-decoration: none;
}

.Sources a:hover {
  text-decoration: underline;
}

.FFTag {
  -moz-transition-property: opacity;
  -webkit-transition-property: opacity;
  -o-transition-property: opacity;
  -ms-transition-property: opacity;
  -moz-transition-duration: 0.25s;
  -webkit-transition-duration: 0.25s;
  -o-transition-duration: 0.25s;
  -ms-transition-duration: 0.25s;
  opacity: 0.25;
  filter: alpha(opacity=25);
}

.FFTag:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

body.is-ie8 .sharing .links a {
  font-size: 0px;
}

body.is-ie8 .Infographic .header h1 {
  height: 240px;
  font-size: 0;
  width: 700px;
}
