@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700&subset=latin,cyrillic);

html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  font-size: 100%;
  font-family: 'Roboto Condensed', sans-serif;
  color: #2d313f;
  background-color: #e7eaf0;
}

/* -------------------------------- 

Основные стили

-------------------------------- */
header {
  height: 200px;
  line-height: 200px;
  text-align: center;
  background: #2d313f;
}
header h1 {
  color: white;
  font-size: 20px;
  font-size: 1.25rem;
}
@media only screen and (min-width: 768px) {
  header {
    height: 300px;
    line-height: 300px;
  }
}

.container-chart {
  width: 100%;
  margin:20px auto;
  max-width: 700px;
}

/*График #1*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль первой линии*/
.chart1.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #F04D3A;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек первой линии*/
.chart1.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #B22819;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль второй линии*/
.chart1.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #4DB543;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек второй линии*/
.chart1.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #0FB500;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль третей линии*/
.chart1.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #ff882e;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек третей линии*/
.chart1.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #b54e00;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль четвертой линии*/
.chart1.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #443fcc;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек четвертой линии*/
.chart1.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #0000b5;
}
/*///////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////CCO*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль первой линии*/
.chart2.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #944df0;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек первой линии*/
.chart2.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #6c12e1;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль второй линии*/
.chart2.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #4cccf2;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек второй линии*/
.chart2.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #11c9d8;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль третей линии*/
.chart2.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #ee5fa0;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек третей линии*/
.chart2.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #e11b75;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль четвертой линии*/
.chart2.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #a8f44f;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек четвертой линии*/
.chart2.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #7add08;
}
/*///////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////CCO*/




/*График #2019*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль первой линии*/
.chart3.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #F04D3A;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек первой линии*/
.chart3.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #B22819;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль второй линии*/
.chart3.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #4DB543;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек второй линии*/
.chart3.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #0FB500;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль третей линии*/
.chart3.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #ff882e;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек третей линии*/
.chart3.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #b54e00;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль четвертой линии*/
.chart3.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #443fcc;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек четвертой линии*/
.chart3.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #0000b5;
}
/*///////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////CCO*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль первой линии*/
.chart4.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #944df0;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек первой линии*/
.chart4.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #6c12e1;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль второй линии*/
.chart4.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #4cccf2;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек второй линии*/
.chart4.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #11c9d8;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль третей линии*/
.chart4.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #ee5fa0;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек третей линии*/
.chart4.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #e11b75;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль четвертой линии*/
.chart4.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #a8f44f;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек четвертой линии*/
.chart4.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #7add08;
}
/*///////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////CCO*/

/*//////////////////////////////////////////////////График #2020-19*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль первой линии*/
.chart5.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #F04D3A;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек первой линии*/
.chart5.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #B22819;
}
/*///////////////////////////////////////////////*/
/*Цвет точек второй линии*/
.chart5.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #4DB543;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек второй линии*/
.chart5.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #0FB500;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль третей линии*/
.chart5.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #ff882e;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек третей линии*/
.chart5.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #b54e00;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль четвертой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #443fcc;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек четвертой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #0000b5;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль пятой линии (1)*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #ed8377;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
 /* animation: dashoffset-seven 200ms infinite linear;*/
}
/*Цвет точек пятой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #b35f56;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль шестой линии (2)*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #7ab874;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
 /* animation: dashoffset-seven 200ms infinite linear;*/
}
/*Цвет точек шестой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #7be371;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль седьмой линии (3)*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #fcab6d;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
/*  animation: dashoffset-seven 200ms infinite linear;*/
}
/*Цвет точек седьмой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #c7895a;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль восьмой линии (4)*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #8c89e8;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
/*  animation: dashoffset-seven 200ms infinite linear;*/
}
/*Цвет точек восьмой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #6060e6;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль девятой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #443fcc;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек девятой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #0000b5;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль обинацатой линии (1)*/
.chart5.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #443fcc;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек десятой линии*/
.chart5.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #0000b5;
}

/*/////////////////////////////////////////////////////////////////CCO*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль первой линии*/
.chart6.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #944df0;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек первой линии*/
.chart6.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #6c12e1;
}
/*///////////////////////////////////////////////*/
.chart6.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #4cccf2;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
.chart6.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #11c9d8;
}
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль третей линии*/
.chart6.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #ee5fa0;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек третей линии*/
.chart6.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #e11b75;
}
/*///////////////////////////////////////////////*/
/*///////////////////////////////////////////////*/
/*Цвет, толщина и стиль четвертой линии*/
.chart6.ct-chart .ct-series.ct-series-d .ct-line {
  stroke: #a8f44f;
  stroke-width: 5px;
  stroke-dasharray: 5px 5px;
  animation: dashoffset-seven 200ms infinite linear;
}
/*Цвет точек четвертой линии*/
.chart6.ct-chart .ct-series.ct-series-d .ct-point{
  stroke: #7add08;
}
/*///////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////CCO*/

/*//////////////////////////////////////////////////График #2020-19*/






@keyframes dashoffset-seven {
  0% {
    stroke-dashoffset: 7px;
  }
  100% {
    stroke-dashoffset: 0px;
  }
}

/*График #2
.chart2.ct-chart .ct-series.ct-series-a .ct-line {
  stroke:#949494;
  stroke-width: 5px;
}
.chart2.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #656565;
}

.chart2.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #6765B5;
  stroke-width: 5px;
  animation: width-pulse 2s infinite;
}
.chart2.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #403CB5;
}

.chart2.ct-chart .ct-series.ct-series-c .ct-line {
  stroke: #949494;
  stroke-width: 5px;
}
.chart2.ct-chart .ct-series.ct-series-c .ct-point{
  stroke: #656565;
}
*/
@keyframes width-pulse {
  0% {
    stroke-width: 6px;
    stroke: #403CB5;
  }
  50% {
    stroke-width: 14px;
    stroke: #E40DE4;
  }
  100% {
    stroke-width: 6px;
    stroke: #403CB5;
  }
}

/**/
.chart5.ct-chart .ct-series.ct-series-b .ct-line {
  stroke: #E44A4A;
  stroke-width: 5px;
  stroke-dasharray: 30px 5px;
  stroke-linecap: round;
  animation: dasharray-craziness 10s infinite linear;
}
.chart5.ct-chart .ct-series.ct-series-b .ct-point{
  stroke: #E40D0D;
}

.chart5.ct-chart .ct-series.ct-series-a .ct-line {
  stroke: #949494;
  stroke-width: 5px;
}
.chart5.ct-chart .ct-series.ct-series-a .ct-point{
  stroke: #656565;
}

@keyframes dasharray-craziness {
  0% {
    stroke-dasharray: 7px 2px;
  }
  80% {
    stroke-dasharray: 7px 100px;
    stroke-width: 10px
  }
  100% {
    stroke-dasharray: 7px 2px;
  }
}


@media only screen and (min-width: 768px) {
  
}

/*Стили для демо*/
.sitehere-demos {
  text-align: center;
}

.sitehere-demos a{
  padding:11px 16px;
  background-color: #fff;
  text-decoration: none;
  color:#2D313F;
  -webkit-transition:all 0.35s ease;
  transition:all 0.35s ease;
}

.sitehere-demos a:hover{
  padding:11px 16px;
  background-color: #3DBC8E;
  text-decoration: none;
  color:#fff;
}

a.current-demo {
  background-color: #30946F;
  color:#fff;
}

.mainTitle {
  text-align: center;
  font-size: 40px;
  font-weight: 800;
  line-height: 70px;
  text-transform: uppercase;
  margin:20px 0;
}

.copyrights {
  background:#01BC78;
  line-height: 3em;
  text-align: center;
  color:#fff;
  font-size: 1.2em;
}

.copyrights a {
  background: #fff;
  color:#01BC78;
  text-decoration: none;
  padding:6px 9px;
  border-radius: 4px;
  -webkit-transition:background 0.35s ease;
          transition:background 0.35s ease;
}

.copyrights a:hover {
  background: #F0F0F0;
  color:#01BC78;
}

.copyrights span {
  position: relative;
  padding-left:14px;
}

.copyrights span:before {
  content:"";
  position: absolute;
  top:0;
  left:4px;
  height: 100%;
  border-right:2px solid #fff;
}

@media all and (max-width: 480px){
  .copyrights {
    padding-top:10px;
  }

  .copyrights span, .copyrights a {
    display: block;
    width: 70%;
    margin:0 auto;
  }

  .copyrights span:before {
    border-right:none;
  }
}









