body {
  background: #215095;
  font-family: 'Open Sans', sans-serif;
  margin: 1rem;
}

h1,h2,h3 {
  font-family: 'Open Sans', sans-serif;
}

p, ul {
  font-size: 0.9rem;
}

h1 {
  font-size: 1.3rem;
  line-height: 1.3rem;
}

h2 {
  font-size: 1.3rem;
  line-height: 1.3rem;
}

h3 {
  font-size: 1.2rem;
  line-height: 1.2rem;
}


.wrapper {
  background: #ffffff;
  padding: 0.5rem;
}

.last, table p {
  margin-bottom: 0;
}

header {
  background: #215095;
  color: #FFFFFF;
}

header .logo a {
  display: block;
  }

@media print, screen and (min-width: 40em) {
  header .logo a img {
    min-width: 15rem;
  }
}

header .orbit p {
    font-size: 1.5rem;
    padding: 0;
    margin: 0;
}

header img {
  padding: .5rem;
}

@media print, screen and (min-width: 40em) {
  header .headlinka {
    max-width: 15rem;
  }
}
/* nav */

nav {
  margin-bottom: 1rem;
  z-index: 1;
}

nav > .sticky {
  background: #DAE0EA;
}

nav.sticky-container .menu .active > a {
    background: transparent;
    color: #000000;
}

nav .menu.dropdown > li > a {
  padding: 1rem;
  position: relative;
}

nav .menu.dropdown a {
  color: #000000;
  font-size: 0.9rem;
  text-transform: uppercase;
  margin: 0 .5rem;
}



nav .menu.dropdown > li > a::before {
  content: ' ';
  width: 0.5rem;
  height: 1rem;
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -.5rem;
  background: url('../img/circle-half-red.svg') no-repeat left center;
}

nav .menu.dropdown > li.active > a::before {
  background: url('../img/circle-half-white.svg') no-repeat left;
}

nav .menu.dropdown > li > a:hover::before {
  background: url('../img/circle-half-black.svg') no-repeat left;
}


nav .menu.icons a {
  color: #000000;
  padding:  0;
  background: none;
  margin: 0 .5rem;
}

nav .menu.icons a.facebook:hover {
  color: #3b5998;
}

nav .menu.icons a.youtube:hover {
  color: #cc181e;
}

nav .menu.icons img {
  max-height: 1.3rem;
}

nav .off-canvas-icon {
  color: #000000;
  padding: 1rem;
  display: inline-block;
  margin-left: -0.5rem;
  line-height: 1;
}

.off-canvas {
    background: #ffffff;
}

/* boxes */

.box {
  position: relative;
  background-size: contain;
  background-position: top center;
  background-repeat: no-repeat;
  transition: all .5s;
  margin-bottom: 1rem;
}

a:hover .box {
  transition: all .5s;
}

a:hover .box span {
  color: #cccccc;
  transition: all .5s;

}

.box span {
  background: #215095;
  color: #ffffff;
  text-align: center;
  padding: 0.5rem;
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  text-transform: uppercase;
  font-size: 1.3rem;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

.box1 {
  background-image: url(../img/box-kdo-jsme.png);
}

.box1:after {
  content: " ";
  display: block;
  padding-bottom: calc(100% + 2.95rem);
}

.box2 {
  background-image: url(../img/box-pomoc-obetem.png);
}

.box2:after {
  content: " ";
  display: block;
  padding-bottom: calc(50% + 2.45rem);
}

.box3 {
  background-image: url(../img/box-podporovatele.png);
}

.box3:after {
  content: " ";
  display: block;
  padding-bottom: calc(100% + 2.95rem);
}

/* sections */
section h2 {
  font-size: 1.3rem;
  line-height: 1.3rem;
  padding: 0.5rem 0 .5rem 1.5rem;
  background: #DAE0EA;
  text-transform: uppercase;
  position: relative;
}

section h2::before {
  content: ' ';
  width: 0.5rem;
  height: 1rem;
  display: block;
  position: absolute;
  left: .5rem;
  top: 50%;
  margin-top: -.5rem;
  background: url('../img/circle-half-red.svg') no-repeat left center;
}


/* aktuality */
section.aktuality > a.button {
  margin-top: 0.5rem;
  text-transform: uppercase;
}

section.aktuality h3 {
  font-size: 1rem;
}

section.aktuality p {
  font-size: 0.8rem;
}

section.aktuality a.readmore {
  text-transform: uppercase;
  color: #000000;
  font-size: 0.8rem;
  font-weight: 700;
}

section.aktuality a.readmore svg {
  color: #C5270D;
}

/* kdo jsme uvod */
section.map {
  padding-bottom: 1rem;
}

section.map .claim {
  font-style: italic;
  padding: 1rem 0;
}

/* SVG map ********************/


#mapa_kraje g a:hover path {
  fill: #212968;
  transition: all 0.3s ease-in-out 0s;
}

#mapa_kraje g a:hover text:not(.piktogram) { 
  fill: #ffffff;
}

section.pobocka .callout {
  margin-top: 1rem;
}


section.pobocka h4.phone {
  color: #cc0000;
  font-weight: normal;
}

section.pobocka h1 {
  font-weight: bold;
}

section.pobocka h3 {
  font-weight: bold;
  color: #215095;
}

section.pobocka h3 strong {
  color: #cc0000;
}

section.projekty h2 {
    font-size: 1.5rem;
    line-height: 1.5rem;
    padding: 0;
    background: transparent;
    text-transform: none; 
    text-align: center;
    position: relative;
}

section.projekty h2::before {
  content: ' ';
  display: block;
  height: 1px;
  background-color: #CCCCCC;
  width: 100%;
  position: absolute;
  top: 50%;
}

section.projekty h2 span {
    padding: .5rem;
    background: #FFFFFF;
    background-size: 100%;
    position: relative;
}


section.projekty a {
    display: inline-block;
}

section.projekty a {
    margin: 1.5rem 0; 
}

@media print, screen and (min-width: 64em) {
  section.projekty a {
      margin: 3rem 0; 
  }
}



section.projekty a img {
    max-height: 70px; 
}

/* Sidebar */

aside nav {
  background: #DAE0EA;
  margin-bottom: 1rem;
}

aside nav .menu a {
  color: #000000;
  font-size: 0.9rem;
  padding: .5rem 2rem .5rem 1rem;
}


aside nav > .menu > li > a {
  background: #215095;
  color: #fefefe;
  padding: 1rem;
  position: relative;
}

aside nav > .menu > li.closed > a::after {
  content: "+";
  display: inline-block;
  position: absolute;
  right: 1rem;
}

aside nav > .menu > li.opened > a::after {
  content: "−";
  display: inline-block;
  position: absolute;
  right: 1rem;
}

aside nav > .menu li li.active > a {
  background: transparent;
  color: #000000;
  font-weight: bold;
}

aside nav .drilldown a {
    background: transparent;
}

aside nav .drilldown .is-drilldown-submenu {
    background: #DAE0EA;
}

aside nav .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::after {
    border-color: #fefefe transparent transparent;
}

.off-canvas .drilldown .is-drilldown-submenu-parent.active>a::after {
    border-color: transparent transparent transparent #ffffff;
}

.off-canvas .dropdown.menu a {
  padding: .7rem 2rem .7rem 1rem;
}

/* Content */
article.content h1 {
  padding: 0.5rem 0 .5rem 1.5rem;
  background: #DAE0EA;
  text-transform: uppercase;
  position: relative;
}

article.content h1::before {
  content: ' ';
  width: 0.5rem;
  height: 1rem;
  display: block;
  position: absolute;
  left: .5rem;
  top: 50%;
  margin-top: -.5rem;
  background: url('../img/circle-half-red.svg') no-repeat left center;
}

article.content h2 {
  font-weight: bold;
}

article.content h3 {
  font-weight: bold;
}

article.content .hl, article.content pre {
  background-color: #d7e3f6;
  color: #0a0a0a;
  position: relative;
  margin: 0 0 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(10,10,10,.25);
  border-radius: 0;

  font-family: "Open Sans",Helvetica,Arial,sans-serif;
  font-size: 0.9rem;

  overflow: visible;
  white-space: normal;
}

article.content .hl a, article.content pre a {
  text-decoration: underline;
}

/* Footer */

footer {
}

footer .disclaimer {
  background:#215095;
  color: #ffffff;
  font-size: 0.75rem;
}

footer .disclaimer a {
  color: #ffffff;
}

footer p {
  margin-bottom: 0;
}

footer .copyright {
  background: #000000;
  color: #ffffff;
  font-size: 0.75rem;
}

footer .copyright a {
  color: #ffffff;
}

/* pagination */
.pagination li.current {
  padding: 0;
}

.pagination li.current a:hover, .pagination li.current button:hover {
    background: inherit;
}


/* cookie-notice */
#cookie-notice {
  background-color: #000000;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  color: #ffffff;
  padding: .2rem 0;
  z-index: 10000002;
  border-top: 1rem solid #215095;
}


ul.soubory {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
}

ul.soubory li {
  padding: .5rem 0;
}

ul.soubory li.hover {
  background-color: #f1f1f1;
}

ul.soubory li .file-datum {
  float: right;
  background-color: #DAE0EA;
  padding: .2rem;
}

/* TIMELINE */
#timeline .line {
  position: relative;
}

#timeline .line .text-small {
  font-size: 75%;
}

#timeline .line:before {
  content: '';
  width: 6px;
  height: 100%;
  position: absolute;
  top: 0;
  background-color: #215095;
  margin-left: -3px;
  left: 50px;
}

#timeline .line > .grid-x .cell h2 {
  margin: 0 0 0 35px;
  font-size: 1.8rem;
  line-height: 1.8rem;
}


#timeline .line > .grid-x .cell.year h2:before
 {
  display: inline-block;
  content: '';
  width: 30px;
  height: 30px;
  border: 8px solid #215095;
  border-radius: 50%;
  vertical-align: middle;
  background: #ffffff;
  position: relative;
  margin-right: 4rem;
}




#timeline .line .grid-x.tn img {
  width: 100px;
  height: 100px;
  border: 6px solid #215095;
  border-radius: 50%;
  position: relative;
}

#timeline .line .grid-x p,
#timeline .line .grid-x h3 {
  margin: 0 0 0 100px;
  padding-left: 2rem;
  padding-right: 0rem;
}


#timeline .line .grid-x.tn p,
#timeline .line .grid-x.tn h3 {
  margin: 0px;
}

@media print, screen and (min-width: 64em) {
  #timeline .line > .grid-x .cell h2 {
    margin: 0;
    padding: 0;
  }

  #timeline .line > .grid-x:nth-child(odd) .cell.year h2:after,
  #timeline .line > .grid-x:nth-child(even) .cell.year h2:before
   {
    display: inline-block;
    content: '';
    width: 30px;
    height: 30px;
    border: 8px solid #215095;
    border-radius: 50%;
    vertical-align: middle;
    background: #ffffff;
    position: relative;
    margin: 0;
  }

  #timeline .line > .grid-x:nth-child(odd) .cell.year h2:before
   {
    display: none;
  }

  #timeline .line > .grid-x:nth-child(odd) .cell.year p
   {
    padding-right: 3rem;
  }

  #timeline .line > .grid-x:nth-child(even) .cell.year p
   {
    padding-left: 3rem;
  }

  #timeline .line:before {
    left: 50%;
  }

  #timeline .line > .grid-x > .cell {
    width: 50%;
  }

  #timeline .line > .grid-x {
    text-align: right;
  }

  #timeline .line > .grid-x:nth-child(even) {
    justify-content: flex-end;
    text-align: left;
  }


  #timeline .line > .grid-x:nth-child(odd) .cell.year h2:after {
    margin-left: 2rem;
    margin-right: -15px;
  }

  #timeline .line > .grid-x:nth-child(even) .cell.year h2:before {
    margin-left: -15px;
    margin-right: 2rem;
  }

  #timeline .line > .grid-x:nth-child(odd) .grid-x.tn {
    margin-right: -50px;
  }

  #timeline .line > .grid-x:nth-child(even) .grid-x.tn {
    margin-left: -50px;
  }

  #timeline .line > .grid-x:nth-child(odd) .grid-x.tn > .cell.shrink {
    order: 2;
  }

  #timeline .line > .grid-x:nth-child(odd) .grid-x.tn > .cell.auto {
    order: 1;
  }

  #timeline .line .grid-x p,
  #timeline .line .grid-x h3 {
    margin: 0;
    padding-left: 2rem;
    padding-right: 2rem;
  }
}