#mapa {
  position: relative;
}
.kraj {
  transition: all 1000ms ease-in-out;
  z-index: 900!important;
}
.kraj:hover{
  fill: #107aae!important;
  cursor: pointer;
   
}
.datakraj, #data-kraj-preview {
  position: absolute;
  top: 0%;
  left: 0%;
  background: #ecf4f8;
  padding:  0px;
  display: block;
}
.noshowkraj {
  display: none;
}
#data-kraj1 {  top: 32%; left: 36%;  }
#data-kraj2 {  top: 32%; left: 48%; }
#data-kraj3 {  top: 12%; left: 28%; }
#data-kraj4 {  top: 5%; left: 48%; }
#data-kraj5 {  top: 30%; left: 67%;  }
#data-kraj6 {  top: 20%; left: 57%;  }
#data-kraj7 {  top: 30%; left: 55%; }
#data-kraj8 {  top: 35%; left: 60%;  }
#data-kraj9 {  top: 55%; left: 55%; }
#data-kraj10 {  top: 45%; left: 70%;  }
#data-kraj11 {  top: 55%; left: 40%; }
#data-kraj12 {  top: 20%; left: 15%; }
#data-kraj13 {  top: 50%; left: 22%; }
#data-kraj14 {  top: 45%; left: 70%;  }
.datakraj h2, #data-kraj-preview h2 {
  background: #107aae;
  color: #fff;
  font-size: 15px;
  margin: 0;
  padding: 8px 10px;
  text-align: left;
}
.datakraj h2 i {
  float: right;
  cursor: pointer;
  margin-top: 2px;
}
.datakraj p, #data-kraj-preview p{
  margin: 7px 10px;
  padding-left: 30px;
  padding-right: 30px;
  font-weight: bold;
    cursor: help; 
  position: relative;
}
.datakraj p:before {
  content: '';
  position: absolute;
  width: 0;
	height: 0;
	border-top: 20px solid #efefef;
	border-right: 20px solid transparent;
  bottom:  15px;
  left: 30%;
   display: none;
}

.datakraj p:after {
  font-weight: normal;
  position: absolute;
  width: auto;
  display: block;
  background: #efefef;
  padding: 5px;
  bottom:  35px;
  left:  30%  ;
  min-width: 160px;
  padding: 10px;
  display: none;
}
.datakraj p:hover:after,  .datakraj p:hover:before {
  display: block!important;
}


.krajPublic {
  background: url('/images/map_red.png') no-repeat left top;
  background-size: contain;
  color: #d2232a;
}
.krajPublic18, .krajPublic17, .krajPublic16, .krajTaxOld, .krajTaxTotalOld, .krajCompOld, .krajCompTotalOld  {  display: none; }
.krajFoundations18, .krajFoundations17, .krajFoundations16  {  display: none; }

.krajPublic span, .krajFoundations  span, .krajTax span, .krajComp span {
   font-size: 10px; 
   color: #107aae; 
   cursor: pointer; 
   float: right; 
   line-height: 20px;
   display :block;
    width: 40px;
}
.krajPublic span:first-of-type, .krajFoundations  span:first-of-type, .krajTax span:first-of-type , .krajComp span:first-of-type {
  
   margin-right: -35px;
}


.krajPublic:after { content: attr(data-name);  }
.krajFoundations:after { content: attr(data-name);  }

#data-kraj1 { xdisplay: block; }

.krajFoundations {    
   background: url('/images/map_blue.png') no-repeat left top;
  background-size: contain;
  color: #23408f;
}
.xxxkrajFoundations:after  {content: 'Počet nadací a fondů v kraji'; }

.krajTax {    
   background: url('/images/map_green.png') no-repeat left top;
  background-size: contain;
  color: #116433;
}
.krajTax:after  {    content: attr(data-name); }

.krajTaxTotal {    
  color: #116433;
}
.krajTaxTotal:after  {    content: attr(data-name);}

.krajComp {    
   background: url('/images/map_violet.png') no-repeat left top;
  background-size: contain;
  color: #812990;
}
.krajComp:after  {    content: attr(data-name);}   

.krajCompTotal {    
  color: #812990;
}
.krajCompTotal:after {    content: attr(data-name);}  


.mapbox {
  width: 32%;
  float: left;
  background: #c2dfec;
  margin-top: 1em;
  margin-right: 1%;
  padding:  0 20px 20px 20px;
 
  box-sizing: border-box;
}
 
.mapbox h3 {
  margin-bottom: 0 ;
}
.mapbox h3 + p { margin-top : 0}
/* oblasti */



#flexpin {
    display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
  height: 5000px;
}


.oblnumner {
  background: #feca0a;
  color: #fff;
  font-weight: bold;
  display: block;
  float: left;
  text-align: center;
  margin-right: 0.3em;
  font-family: 'Open Sans Condensed', sans-serif;
}
.obl { margin-top: 2em; }
.obl:nth-of-type(1) { font-size: 30px; }
.obl:nth-of-type(2) { font-size: 25px;   text-align: right } .obl:nth-of-type(2) .oblnumner { float: right; margin-left: 0.3em; }
.obl:nth-of-type(3) { font-size: 20px;   }
.obl:nth-of-type(4) { font-size: 20px;  text-align: right; } .obl:nth-of-type(4) .oblnumner { float: right; margin-left: 0.3em;  }
.obl:nth-of-type(5) { margin-left: 60px; }

.topnf .bignr {
  color: #0072bc;
  font-family: 'Open Sans Condensed', sans-serif;
  font-weight: bold;
  display: block;
}
 .topnf2 .bignr {
  color: #0072bc;
  font-family: 'Open Sans Condensed', sans-serif;
  font-weight: bold;
  font-size: 20px;
}
.topnf p:nth-of-type(3)  .bignr { font-size: 55px; }
.topnf p:nth-of-type(4)  .bignr { font-size: 50px; }
.topnf p:nth-of-type(5)  .bignr { font-size: 45px; }

.topnf2 p:nth-of-type(2)  .bignr { font-size: 35px; }
.topnf2 p:nth-of-type(3)  .bignr { font-size: 30px; }
.topnf2 p:nth-of-type(4)  .bignr { font-size: 25px; }
.bignr { font-size: 25px; line-height: 1.2em }

 

.darci strong { color : #f58220; color: #404040}
.darci2 .bignr {
  background: black;
  color: #fff;
  display: block;
  width: 180px;
  height: 180px;
  border-radius: 90px;
  text-align: center;
  padding-top:35px;
  float: right;
  font-size: 17px;
  line-height: 1.5em;
}
.darci2 .bignr strong {
  font-size: 200%;
  font-weight: bold;
  display: block;
}
.darci2 .ballonz  p  {
  position: relative;
  line-height: 90px;
  height: 90px;
  margin-top: 4em;
   }
.darci2 .ballonz p span {
  position: absolute; 
  left: 10px;
  height: 90px;
  color: #fff;
}

.darci2 .ballonz p:nth-of-type(1):before{
  content: '';
	width: 90px;
	height: 90px;
	background: #f58220;
	-moz-border-radius: 45px;
	-webkit-border-radius: 45px;
	border-radius:45px;
  display:block;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 0;
 }
.darci2 .ballonz p:nth-of-type(2):before{
  content: '';
	width: 30px;
	height: 30px;
	background: #f58220;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius:15px;
  display:block;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 0;
 }
  .darci2 .ballonz p:nth-of-type(2) {
     
      height: 30px;
        line-height: 30px;
        margin-top: 3em;
        margin-left: 2em;
  }
 .darci2 .ballonz p:nth-of-type(2) span {
  position: absolute; 
  left: 40px;
  height: 30px;
  color: #000;
}
.darci2 .ballonz p:nth-of-type(3):before  {
  content: '';
	width: 20px;
	height: 20px;
	background: #f58220;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius:10px;
  display:block;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 0;
 }
  .darci2 .ballonz p:nth-of-type(4):before, .darci2 .ballonz p:nth-of-type(5):before, .darci2 .ballonz p:nth-of-type(6):before {
  content: '';
	width: 16px;
	height: 16px;
	background: #f58220;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius:8px;
  display:block;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 0;
 }
  .darci2 .ballonz p:nth-of-type(3)  {

      height: 16px;
        line-height: 16px;
        margin-top: 1em;
        margin-left: 2.20em;
  }
 .darci2 .ballonz p:nth-of-type(4),  .darci2 .ballonz p:nth-of-type(5) ,  .darci2 .ballonz p:nth-of-type(6),  .darci2 .ballonz p:nth-of-type(7) {
      height: 16px;
        line-height: 16px;
        margin-top: 1em;
        margin-left: 2.26em;
  }
 .darci2 .ballonz p:nth-of-type(3) span  {
  position: absolute; 
  left: 37px;
  height: 30px;
  color: #000;
}
  .darci2 .ballonz p:nth-of-type(4) span, .darci2 .ballonz p:nth-of-type(5) span, .darci2 .ballonz p:nth-of-type(6) span, .darci2 .ballonz p:nth-of-type(7) span {
  position: absolute; 
  left: 37px;
  height: 16px;
  color: #000;
}

.topdarci h4 {
  color: #802990;
  font-size: 150%;
  font-weight: bold;
  
    margin-top: 0.5em
}
.topdarci .smaller { font-size: 90%}
.smaller { font-size: 80% }

.topdarci .nmbrz span { width: 90px; height: 90px; display: block; float: left; position: relative; margin-right: 1em; }
.topdarci .nmbrz span:before { 
  content: '';
	width: 90px;
	height: 90px;
	background: #802990;
	-moz-border-radius: 45px;
	-webkit-border-radius: 45px;
	border-radius:45px;
  display:block;
  top: 0;
  left: 50%;
  position: absolute;
  z-index: 0; 
  -ms-transform: translateX(-50%); /* IE 9 */
    -webkit-transform: translateX(-50%); /* Safari */
    transform: translateX(-50%); /* Standard syntax */
  }
.topdarci .nmbrz  { line-height: 90px; clear: left  ; margin-bottom: 0.5em;}

.topdarci .nmbrz:nth-of-type(3)  span {  height: 60px;  }
.topdarci .nmbrz:nth-of-type(3) span:before {  width: 60px; height: 60px; 	-moz-border-radius: 30px; 	-webkit-border-radius:30px; 	border-radius:30px;  }
.topdarci .nmbrz:nth-of-type(3)  { line-height: 60px;  }

.topdarci .nmbrz:nth-of-type(4)  span {  height: 56px;  }
.topdarci .nmbrz:nth-of-type(4) span:before {  width: 56px; height: 56px; 	-moz-border-radius: 29px; 	-webkit-border-radius:29px; 	border-radius:29px;  }
.topdarci .nmbrz:nth-of-type(4)  { line-height: 56px;  }

.topdarci .nmbrz:nth-of-type(5)  span {  height: 16px;  }
.topdarci .nmbrz:nth-of-type(5) span:before {  width: 16px; height: 16px; 	-moz-border-radius: 8px; 	-webkit-border-radius:8px; 	border-radius:8px; opacity: 0.5  }
.topdarci .nmbrz:nth-of-type(5)  { line-height: 16px;  }


.topdarci .nmbrz:nth-of-type(6)  span {  height: 10px;  }
.topdarci .nmbrz:nth-of-type(6) span:before {  width: 10px; height: 10px; 	-moz-border-radius: 5px; 	-webkit-border-radius:5px; 	border-radius:5px; opacity: 0.5  }
.topdarci .nmbrz:nth-of-type(6)  { line-height: 10px;  }

.topdarci .nmbrz:nth-of-type(7)  span {  height: 56px;  }
.topdarci .nmbrz:nth-of-type(7) span:before {  width: 56px; height: 56px; 	-moz-border-radius: 29px; 	-webkit-border-radius:29px; 	border-radius:29px;  }
.topdarci .nmbrz:nth-of-type(7)  { line-height: 56px;  }

.topdarci .nmbrz:nth-of-type(8)  span {  height: 54px;  }
.topdarci .nmbrz:nth-of-type(8) span:before {  width: 54px; height: 54px; 	-moz-border-radius: 27px; 	-webkit-border-radius:27px; 	border-radius:27px;  }
.topdarci .nmbrz:nth-of-type(8)  { line-height: 1em;  }


.topdarci .nmbrz:nth-of-type(9)  span {  height: 16px;  }
.topdarci .nmbrz:nth-of-type(9) span:before {  width: 16px; height: 16px; 	-moz-border-radius: 8px; 	-webkit-border-radius:8px; 	border-radius:8px; opacity: 0.5  }
.topdarci .nmbrz:nth-of-type(9)  { line-height: 16px;  }

.sbirky .str1 , .sbirky .str2{
  color: #00aeef;
  font-weight: bold;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 150%;
}
.sbirky .str2{
   color: #253f8e;
}
.sbirky .str3 , .sbirky .str3{
  color: #00aeef;
  font-weight: bold;
  
}
.sbirky .str4{
   color: #253f8e;
}
.sbirky h4 {
  margin-top: 1em;
}
.world strong {
  color: #8657b1;
}
.perc {
  padding-top: 1em;
  
}
.perc p {
  clear: left;
}
.perc span{
  color: #d1232a;
    font-weight: bold;
  font-family: 'Open Sans Condensed', sans-serif;
}
.perc i {  font-style: normal; }

.perc p:nth-of-type(1) span { font-size: 78px;  float: left; display:  inline-block; margin-top: -24px; margin-right: 20px;} 
.perc p:nth-of-type(2) span { font-size: 42px;  float: left; display:  inline-block; margin-top: -12px; margin-right: 20px;} 
.perc p:nth-of-type(3) span { font-size: 37px;  float: left; display:  inline-block; margin-top: -10px; margin-right: 20px;} 
.perc p:nth-of-type(3) span { font-size: 22px;  float: left; display:  inline-block; margin-top: -8px; margin-right: 20px;} 
.perc p:nth-of-type(3) span { font-size: 21px;  float: left; display:  inline-block; margin-top: -7px; margin-right: 20px;} 

.dary strong {  
   color: #d1232a;
   
    font-weight: bold; }
.crowd strong {
  color: #40ae49
}

.socialka .grfb { font-weight: bold; color: #0072bc }
.socialka .gryt { font-weight: bold; color: #d1232a }
.socialka .grtw { font-weight: bold; color: #00aeef }
.socialka .grin { font-weight: bold; color: #ed028c }

.socialka .gr1 { font-weight: bold; color: #40ae49; font-size: 50px; display: inline-block; float: left; margin-top: -5px ; margin-right: 10px; clear: left}
.socialka .gr2 { font-weight: bold; color: #40ae49; font-size: 45px; display: inline-block; float: left; margin-top: -5px ; margin-right: 10px; clear: left}
.socialka .gr3 { font-weight: bold; color: #40ae49; font-size: 20px; display: inline-block; float: left; margin-top: -5px ; margin-right: 10px; clear: left}
.socialka .gr {clear: left }


#data-kraj-preview { display: block!important; top: -70px; right: 0; left: auto; width: 250px; background: #fff ;  }
#data-kraj-preview  p { font-weight: normal!important; font-size: 10px; background-size: 20px; min-height: 20px!important; } 
#data-kraj-preview em { font-size: 10px; font-style: normal;  padding: 0 10px 10px 10px; line-height: 11px; display: block;}

.first p { font-weight: bold;}
.first p:nth-of-type(1) span:nth-of-type(1)  { color: #00aeef; font-size: 35px }
.first p:nth-of-type(1) span:nth-of-type(2)  { color: #d1232a; font-size: 35px }
.first p:nth-of-type(2) span:nth-of-type(1)  { color: #00aeef;font-size: 30px  }
.first p:nth-of-type(2) span:nth-of-type(2)  {  color: #d1232a;font-size: 30px  }

.second    h3 { color: #d1232a;font-size: 30px ; font-weight: bold; margin-top: 0 }
.second span { color: #00aeef; font-weight: bold;}
 
h1 { padding-right: 400px }



@media screen and (max-width: 1210px) {
  #flexpin { height: 5700px; }
}
@media screen and (max-width: 1024px) {
  #flexpin { height: 6500px; }
}
@media screen and (max-width: 900px) {
  .mapbox { width: 49%; margin-right: 2%; }
   #flexpin { height: 9000px; }
}



@media screen and (max-width: 600px) {
  section {padding-left: 0 }
  .mapbox { width: 100%; margin-right : 0; }
   #flexpin { display: block; height: auto; }
   h1 { padding: 0; }
   .datakraj { top: 55%!important;
    left: 0%!important;
    width: 100%;}
   #data-kraj-preview {
    position: relative;
    width: 100%;
    top: auto;
}
 #data-kraj-preview p { min-height: 20px!important;  } 
}
#data-kraj-preview p:after { display: none;}

a.blueone {
  color: #fff;
  background: #0072bc;
  position: absolute;
  right: 0;
  bottom: 0;
    padding: 5px;
  font-size: 10px;
}
.world {
  position: relative;
  padding-bottom: 2em
}
h2 {
  font-size: 120%;
  background: #107aae;
  color: #fff;
  margin-top:  0px;
  margin-left: -20px;
  margin-right: -20px;
  margin-bottom: 20px;
  padding: 20px;
}


.socialsites .fb { color: #29487d }
.socialsites .in { color: #dd2a7b }
.socialsites .tw { color: #00aced }
.socialsites .li { color: #0077b5 }
.socialsites .wa { color:  #25D366 }

.socialsites .perc p  span { font-size: 30px;  float: left; display:  inline-block; margin-top: -7px; margin-right: 20px;} 
.socialsites .perc p:nth-of-type(1) span { font-size: 56px;  float: left; display:  inline-block; margin-top: -24px; margin-right: 20px;} 
.socialsites .perc p:nth-of-type(2) span { font-size: 40px;  float: left; display:  inline-block; margin-top: -12px; margin-right: 20px;} 
.socialsites .perc p:nth-of-type(3) span { font-size: 35px;  float: left; display:  inline-block; margin-top: -10px; margin-right: 20px;} 
.socialsites .perc p:nth-of-type(4) span { font-size: 32px;  float: left; display:  inline-block; margin-top: -8px; margin-right: 20px;} 
.socialsites .perc p:nth-of-type(5) span { font-size: 31px;  float: left; display:  inline-block; margin-top: -7px; margin-right: 20px;} 




/* 2019 nevim, co delat, kdyz nemam nejnovejsi data o danich atd... */

.krajTaxTotal , .krajTax, .krajComp , .krajCompTotal  { display:  none;  }
.nwrp, .number19 { display: inline-block;
  white-space: nowrap; }

  .sipkagreen {
    color: #40ae49;
    margin: 0 5px;
    font-size: 80%;
  }

  .sipkaorange {
    color: #f58220;
    margin: 0 5px;
    font-size: 80%;
  }
  .strng { font-weight: bold; }
  .stoupa .colr { color: #f58220; }


  .nrnew {
    display: inline-block;
   white-space: nowrap;
   font-weight: bold;
   position: relative;
  }
  .nrnew:before {
    content: '\f04b';
    font-family: FontAwesome;
    display: block;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    font-size: 70%;
    margin: 0 3px;
  }


  .newnr {
   display: inline-block;
   white-space: nowrap;
   font-weight: bold;
   position: relative;
  }
  .newnr:after {
    content: '\f101';
    font-family: FontAwesome;
    display: block;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    font-size: 120%;
    margin: 0 5px;
  }

 .chartline {
   display: inline-block; 
   height: 10px;
   border-radius: 5px;
   background: #e3aa18;
   margin-right: 10px;
 }
 .breakme {
   padding: 10px 0;
   margin: 10px 0;
   border: 3px dotted #885ab2;
   border-width: 3px 0 3px 0;
 }
  .fakenews h2 {
    background: #885ab2; 
  }
  .fakenews h3 {
    color: #885ab2; 
    font-weight: bold;
    margin-bottom: 0.5em;
  }
  .fakenews .nrnew:before  {
    color: #885ab2; 
  }
  .fakenews p {
    margin-bottom: 0.7em;
  }
  .breakme span.fakenews { 
    color: #885ab2;
    font-weight: bold;
    font-size: 120%;
  }


  .cliche h2 {
    background: #e4aa17; 
  }
  .cliche h3 {
    color: #e4aa17; 
    font-weight: bold;
    margin-bottom: 0.5em;
    font-size: 90%;
  }
  .cliche .nrnew:before  {
    color: #e4aa17; 
  }
  .cliche p {
    margin-bottom: 0.7em;
  }
 
 span.cliche { 
    color: #e4aa17;
    font-weight: bold;
    font-size: 120%;
  }

  .dms h2 {
    background: #3a9e7d; 
  }
  .dms h3 {
    color: #3a9e7d; 
    font-weight: bold;
    margin-bottom: 0.5em;
    font-size: 90%;
  }
  .dms .nrnew:before  {
    color: #3a9e7d; 
  }
  .dms p {
    margin-bottom: 0.7em;
  }
 .dms hr{ 
   border: 2px dotted #3a9e7d; 
   border-width: 2px 0 0 0;
 }
 .obl .dms {
   color: #fff;
   background: #3a9e7d; 
 }

 span.dms { 
    color: #3a9e7d;
    font-weight: bold;
    font-size: 120%;
  }


  .slovensko h2 {
    background: #9ab420; 
  }
  .slovensko h3 {
    color: #9ab420; 
    font-weight: bold;
    margin-bottom: 0.5em;
    font-size: 100%;
  }
  .slovensko .nrnew:before  {
    color: #9ab420; 
  }
  .slovensko p {
    margin-bottom: 0.7em;
  }
 
 span.slovensko { 
    color: #9ab420;
    font-weight: bold;
    font-size: 120%;
  }


  .world h2 {
    background: #d3703f; 
  }
  .world h3 {
    color: #d3703f; 
    font-weight: bold;
    margin-bottom: 0.5em;
    font-size: 100%;
  }
  .world .nrnew:before  {
    color: #d3703f; 
  }
  .world p {
    margin-bottom: 0.7em;
  }
 
 span.world { 
    color: #d3703f;
    font-weight: bold;
    font-size: 120%;
  }

 span.world { 
    color: #d3703f;
    font-weight: bold;
    font-size: 120%;
  }
  .world  strong { color: #000;  }
 span.fakenews {
  color: #885ab2;
  font-weight: bold;
  font-size: 120%;
 }
  .quater {
    width: calc(95% / 4) ;
    text-align: center;
    border: 0px solid #e7e7e7;
    display: inline-block;
    white-space: nowrap;
    cursor: help;
  }
.note { color: #4aa9d4}

.pomer{
  width: 100%;
  height: 25px;
  border-radius:  5px; 
  display: block;
  margin-top: 15px;
}
.pomerbig { background:  #9ab420 }
.pomersmall { background:  #d3703f; ; font-weight: bold; color: #fff; padding-left: 15px; line-height: 25px; margin-bottom: 5px; }
 
span.big { color:#9ab420; font-weight: bold; }
span.small { color:#d3703f ; font-weight: bold  }

.down { text-transform: lowercase;  }
p.down::first-letter {   text-transform: uppercase;  } 

.world .gr1 { font-weight: bold; color: #d3703f; font-size: 50px; display: inline-block; float: left; margin-top: -5px ; margin-right: 10px; clear: left}
.world .gr2 { font-weight: bold; color: #d3703f; font-size: 45px; display: inline-block; float: left; margin-top: -5px ; margin-right: 10px; clear: left}
.world .gr3 { font-weight: bold; color: #d3703f; font-size: 20px; display: inline-block; float: left; margin-top: -5px ; margin-right: 10px; clear: left}
.world .gr {clear: left }
.world .bgnr {
  color: #d3703f;
  font-size: 130%;
  font-weight: bold;
}
.world .scnr {
   
  color:  #369274;
  font-size: 100%;
  font-weight: bold;
 
}