@charset "UTF-8";
 /* CSS Document */
 @font-face {
   src: url('../fonts/BebasNeue.otf') format('opentype');
   font-family: 'BebasNeue';
   font-weight: normal;
   font-style: normal;
 }


 .chart-content p:last-child {
   margin-bottom: 0;
 }
 .first-text {
   font-size: 38px;
   font-weight: 600;
   float: left;
   line-height: 44px;
   margin-right: 20px;
 }
 .chartText {
   font-size: 12px;
 }
 .area {
   fill: #e3e3e3;
 }
 .chart-content {
   background: #fff;
   color: #000;
   padding: 20px;
   font-size: 15px;
   font-family: Open Sans, sans-serif;
   line-height: 30px;
   border-radius: 2px;
   border: 1px solid #e9e4e4;
   margin-bottom: 15px;
   box-shadow: 0 0 10px rgb(0 0 0 / 4%);
   -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .04);
   -webkit-box-shadow: 0 0 10px rgb(0 0 0 / 4%);
   width: 100%;
   float: left;
 }
 .author-logo {
   padding: 53px 0;
   text-align: center;
   float: right;
 }
 .blog-background {
   font-size: 15px;
  
   color: #000;
 }
 .blog-background h1 a {
   color: #ffffff;
 }
 .xAxis-text, .yAxis-text, .y1Axis-text {
   font-size: 13px;
   font-weight: 600;
   color: #000000;
 }
 .xAxis-text {
   transform: translate(38%, 40px);
 }
 .recessionLine {
   fill: rgba(35, 22, 44, 0.56);
   stroke-width: 9px;
 }
 .inflationLine {
   stroke-width: 9px;
   fill: none;
 }
 .y1Axis-text {
   transform: translate(92%, -60px) rotate(90deg)
 }
 .g-hed {
   text-align: left;
   font-family: 'BebasNeue';
   text-transform: uppercase;
   font-weight: 100;
   font-size: 35px;
   color: #000;
   margin: 3px 0;
 }
 .g-source-bold {
   text-align: left;
   font-size: 10px;
   font-weight: bold;
 }
 .focusRect {
   fill: #ff2f6f;
   border-radius: 50%;
   border: 3px solid #fff
 }
 .g-source {
   margin: 10px 0;
 }
 .g-source-bold {
   text-align: left;
   font-size: 10px;
 }
 .hover-line {
   stroke: #fe6e31;
   stroke-width: 2px;
   stroke-dasharray: 3, 3;
 }
 .g-intro {
   font-size: 18px;
   color: #000;
   margin: 0px 0px 10px 0px;
   font-family: 'Open Sans', sans-serif;
   border-bottom: 1px solid #eaeaea;
   padding-bottom: 12px;
 }
 .areaA {
   background: rgb(188, 39, 123);
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
 .areaB {
   background: rgb(236, 203, 28);
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
 .chart-date {
   color: #9e9797;
   font-size: 13px;
   line-height: 25px;
   margin-bottom: 0;
   border-bottom: 3px solid #fe6e31;
   display: table;
   float: right;
   padding: 1px 10px;
   background: #fff;
   position: absolute;
   bottom: 0;
   right: 0;
 }
 .g-labels {
   fill: white;
   font-weight: bold;
   font-size: 13px;
 }
 .g-chart {
   overflow: hidden;
   background: #fff !important;
   padding: 10px;
   border-radius: 2px;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16862745098039217);
   -moz-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16862745098039217);
   -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16862745098039217);
   width: 100%;
   height: 680px;
   position: relative;
 }
 .area .legend-box {
   margin: 0 auto;
   float: none;
   display: table;
   width: 100%;
 }
 .axis line {
   fill: none;
   stroke: #000000;
   stroke-dasharray: 3px 3px;
   shape-rendering: crispEdges;
   stroke-width: 1px;
   opacity: 0.1;
 }
 .blog h2, .blog p {
   display: none;
 }
 .axis text {
   font-size: 11px;
   pointer-events: none;
   fill: #000;
 }
 .y.axis text {
   text-anchor: end !important;
   font-size: 11px;
   fill: #000;
 }
 .domain {
   display: none;
 }
 .focusRect {
   fill: #fe6e31;
   border-radius: 50%;
   border: 3px solid #fff
 }
 .line {
   stroke: #2f5491;
   fill: none;
 }
 .overlay {
   fill: none;
   pointer-events: all;
 }
 .focus {
   font-size: 13px;
 }
 .blog-image-hide {
   display: none;
 }

 .IK-gujral-image {
   transform: translate(81px, 239px);
 }
 .modi-image {
   transform: translate(62%, -14px);
 }
 .manmohan-image {
   transform: translate(40%, 50px);
 }
 .abv-image {
   transform: translate(14%, 180px);
 }
 .deve-image {
   transform: translate(66px, 244px);
 }
 .rao-image {
   transform: translate(6px, 248px);
 }
 .legend1 {
   display: inline-table;
   padding: 2px;
   color: #000;
   line-height: 17px;
 }
 .legend {
   margin-right: 20px;
 }
 .N-Rao, .deve-G, .gujral, .vajpayee, .mohan, .modi {
   background: #02ccf0;
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
 .blog-background h1 a {
   color: #ffffff;
 }
 .xAxis-text, .yAxis-text, .y1Axis-text {
   font-size: 13px;
   font-weight: 600;
   color: #000000;
 }
 .xAxis-text {
   transform: translate(38%, 40px);
 }
 .y1Axis-text {
   transform: translate(92%, -60px) rotate(90deg)
 }
 .g-hed {
   text-align: left;
   font-family: 'BebasNeue';
   text-transform: uppercase;
   font-weight: 100;
   font-size: 35px;
   color: #000;
   margin: 3px 0;
 }
 .g-source-bold {
   text-align: left;
   font-size: 10px;
   font-weight: bold;
 }
 .focusRect {
   fill: #ff2f6f;
   border-radius: 50%;
   border: 3px solid #fff
 }
 .g-source {
   margin: 10px 0;
 }
 .g-source-bold {
   text-align: left;
   font-size: 10px;
 }
 .hover-line {
   stroke: #fe6e31;
   stroke-width: 2px;
   stroke-dasharray: 3, 3;
 }
 .g-intro {
   font-size: 18px;
   color: #000;
   margin: 0px 0px 10px 0px;
   font-family: 'Open Sans', sans-serif;
   border-bottom: 1px solid #eaeaea;
   padding-bottom: 12px;
 }
 .areaA {
   background: rgb(188, 39, 123);
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
 .areaB {
   background: rgb(236, 203, 28);
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
 .chart-date {
   color: #9e9797;
   font-size: 13px;
   line-height: 25px;
   margin-bottom: 0;
   border-bottom: 3px solid #fe6e31;
   display: table;
   float: right;
   padding: 1px 10px;
   background: #fff;
   position: absolute;
   bottom: 0;
   right: 0;
 }
 .g-labels {
   fill: white;
   font-weight: bold;
   font-size: 13px;
 }
 
 .area .legend-box {
   margin: 0 auto;
   float: none;
   display: table;
   width: 100%;
 }
 .axis line {
   fill: none;
   stroke: #000000;
   stroke-dasharray: 3px 3px;
   shape-rendering: crispEdges;
   stroke-width: 1px;
   opacity: 0.1;
 }
 .blog h2, .blog p {
   display: none;
 }
 .axis text {
   font-size: 11px;
   pointer-events: none;
   fill: #000;
 }
 .y.axis text {
   text-anchor: end !important;
   font-size: 11px;
   fill: #000;
 }
 .domain {
   display: none;
 }
 .focusRect {
   fill: #fe6e31;
   border-radius: 50%;
   border: 3px solid #fff
 }
 .line {
   stroke: #2f5491;
   fill: none;
 }
 .overlay {
   fill: none;
   pointer-events: all;
 }
 .focus {
   font-size: 13px;
 }
 .blog-image-hide {
   display: none;
 }

 .IK-gujral-image {
   transform: translate(133px, 219px);
 }
 .modi-image {
   transform: translate(62%, -14px)
 }
 .manmohan-image {
   transform: translate(40%, 50px);
 }
 .abv-image {
   transform: translate(17%, 158px);
 }
 .deve-image {
   transform: translate(118px, 234px);
 }
 .rao-image {
   transform: translate(62px, 248px);
 }
 .legend1 {
   display: inline-table;
   padding: 2px;
   color: #000;
   line-height: 17px;
 }
 .legend {
   margin-right: 20px;
 }
 .N-Rao, .deve-G, .gujral, .vajpayee, .mohan, .modi {
   background: #02ccf0;
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
 .chart-content .legend-chart1 h3 {
   margin-top: 0;
   text-decoration: none;
   margin-bottom: 10px;
 }
 .legend2 {
   line-height: 25px;
   font-size: 14px;
 }
 .deve-G {
   background: #f97d09;
 }
 .gujral {
   background: #138808;
 }
 .vajpayee {
   background: #ff9933;
 }
 .mohan {
   background: #006fe0;
 }
 .modi {
   background: #f97d09;
 }
 .legend-chart {
   text-align: left;
    padding: 11px 15px;
    position: absolute;
    bottom: 40px;
    margin: 0;
    left: 20px;
    line-height: 0px;
    width: 70%;
    float: left;
 }

 .legend1 p:last-child {
   margin-bottom: 0;
 }
 .legend-chart h3 {
   margin-top: 0;
   color: #000;
   margin-bottom: 6px;
   font-size: 14px;
   font-weight: 600;
   text-transform: uppercase;
 }
 .legend-text {
   line-height: 16px;
   display: table-cell;
   font-size: 12px;
 }
 .legend-text1 {
   font-size: 12px;
 }
 div.tooltip {
   position: absolute;
   text-align: left;
   color: #000;
   padding: 5px 10px;
   font: 16px sans-serif;
   background: #fff;
   border: 0px;
   border-radius: 2px;
   pointer-events: none;
   border-left: #fe6e31 3px solid;
   box-shadow: 0 0px 20px rgba(0, 0, 0, 0.34);
 }
 div.tooltip_GDP
{
	position: absolute;
   text-align: left;
   color: #000;
   padding: 5px;
   background: #fff;
   border: 0px;
   border-radius: 2px;
   pointer-events: none;
   border-left: #c9074a 3px solid;
   box-shadow: 0 0px 20px rgba(0, 0, 0, 0.34);
}
 .padding0 {
   padding: 0;
 }
 .white-back {
   background: #f3f4f8;
   padding: 30px;
   display: flex;
 }
 .author-content {
   background-color: #f3f4f8;
   padding: 20px;
   width: 100%;
   float: left;
   position: relative;
 }
 .chart-content h4 {
   font-size: 22px;
   margin-top: 0;
   font-family: 'Open Sans', sans-serif;
   font-weight: 600;
   margin-bottom: 20px;
 }

 .none {
   display: none;
 }
 .margin0 {
   margin: 0;
 }
 .blog-background .author-chart {
   text-decoration: underline;
 }
 .chart-content h5 {
   font-size: 16px;
 }
 .author-box {
   padding: 70px;
   position: relative;
   background-color: #FFFFFF;
   background: repeating-linear-gradient(-45deg, #fff, #fff 4px, #F4F6F8 6px, #F4F6F8 9px);
   background-size: auto;
   background-size: 267px 300px;
 }

 .chart-formula {
   display: flex;
   font-weight: 600;
   margin: 20px 0;
   border-left: 3px solid #fe6e31;
   padding: 5px 10px;
   background: #f3f4f8;
 }
 .for-right {
   padding-left: 5px;
 }
 .formula-box {
   font-weight: 600;
 }
 .sub-formula {
   font-size: 10px;
   vertical-align: sub;
   display: contents;
 }
 .padding-R {
   padding-right: 0;
 }

 .source-head {
   background: #fe6e31;
   color: #fff;
   padding: 10px;
   margin-bottom: 0;margin-top: 20px;
   box-shadow: 0 0px 10px rgba(0, 0, 0, 0.3);
 }








.line {
  fill: none;

}
 .axis line {
  fill: none;
  stroke: #000000;
  stroke-dasharray: 3px 3px;
  shape-rendering: crispEdges;
  stroke-width: 1px;
  opacity: 0.1;
}

.handle--e, .handle--w {
  fill: #fe6e31;
  width: 12px
}
.selection {
  fill: #333333;fill-opacity: 1;
}
.data-circle {
  fill: #3C92BA;
}
	.congressBlue
	{
		stroke:#02ccf0;
	}
	.jantaDalorange
	{
		stroke:#f97d09;
	}
	.jantaDalgreen
	{
		stroke:#138808;
	}
	.BJPorange, .BJPorangeold
	{
		stroke:#ff9933
	}
	.congressblue
	{
		stroke:#006fe0;
	}
	.zoom
{
	fill:none;
}
	
.handle--e, .handle--w {
  fill: #fe6e31;
  width: 12px
}
.selection {
  fill: #333333;fill-opacity: 1;
}
.GDP_chart
{
	position:relative;
}
.GDP_chart svg
  {
      stroke-width:0;
background:#ffffff;position:relative;
  }
  
.GDP_chart .axis-x
	{
		opacity:0;
	}

#my_dataviz 
{
	position:relative;
}

#my_dataviz .legend-GDP .legend1
{
	    margin-right: 60px;
}
 .areaD {
   background: rgb(226, 6, 19);
   height: 10px;
   width: 15px;
   display: inline-block;
   margin-right: 10px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6588235294117647);
 }
.pop_growthrate, .national_income, .national_incomeGrowth
{
	background-color:#d6de21;height: 10px;
    width: 15px;
    display: inline-block;
    margin-right: 10px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 66%);
}
.national_income
{
	background-color:#c9074a;
}
.national_incomeGrowth
{
	background-color:#00829e;
}
#my_dataviz .domain {
	display: block;
}
#my_dataviz {
	background: #ffffff;
}
	#my_dataviz h1
	{
		padding:20px;margin-bottom:0;
	}
 @media(max-width:1366px) {
   .chartText {
     font-size: 9px;
   }
 }
 @media(max-width:1024px) {
   .legend-text {
     font-size: 10px
   }
   #status2 {
     left: 370px;
   }
   #status1, #status2, #status3 {
     width: 40%;
     top: -250px;
     left: 353px;
   }
   .legend-chart {
     left: 0;
   }
   .legend-text1 {
     font-size: 10px;
   }
 }
 .rao-image {
   transform: translate(12px, 617px);
 }
 .deve-image {
   transform: translate(65px, 609px);
 }
 .IK-gujral-image {
   transform: translate(80px, 601px);
 }
 .abv-image {
   transform: translate(13%, 538px);
 }
.manmohan-image {
    transform: translate(26%, 420px);
}
.modi-image {
    transform: translate(60%, 106px);
}
 .y1Axis-text {
   transform: translate(98%, -10px) rotate(90deg);
 }
 
 @media(max-width:982px) {
   .chart-content {
     font-size: 14px;
   }
   .g-hed {
     font-size: 25px;
   }
   .g-intro {
     font-size: 15px;
   }
   .y1Axis-text {
     transform: translate(87%, -60px) rotate(90deg);
   }
   .xAxis-text {
     transform: translate(31%, 50px);
   }
   .rao-image {
     transform: translate(3px, 248px);
   }
   .IK-gujral-image {
     transform: translate(65px, 219px);
   }
   .abv-image {
     transform: translate(13%, 181px);
   }
   .manmohan-image {
     transform: translate(30%, 100px);
   }
   .modi-image {
     transform: translate(63%, -27px);
   }
   .deve-image {
     transform: translate(51px, 234px);
   }
 }
 @media(max-width:767px) {
   .xAxis-text {
     transform: translate(18%, 50px);
   }
   .legend-chart {
     display: none;
   }
   .modi-image, .rao-image, .deve-image, .abv-image, .manmohan-image, .IK-gujral-image {
     display: none;
   }
   .y1Axis-text {
     transform: translate(87%, -60px) rotate(90deg);
   }
 }
 @media(max-width:600px) {
   .xAxis-text {
     transform: translate(18%, 38px);
   }
 }
 @media(max-width:480px) {
   .y1Axis-text {
     transform: translate(77%, -60px) rotate(90deg);
   }
 }