@charset "UTF-8";
:root{
  --my-color-main: #050395;
  --my-color-main-middle: #5350fb;
  --my-color-border: #dee2e6;
  --my-bg-color-list: #ffdf80;
  --my-bg-color-list-example: #93ebc2;
  --my-bg-color-header: #f4f4ff;
  --my-bg-color-content: #f4fff4;
  /*--my-bg-color-content: #f9fff9;*/
  --my-bg-color-hover: lightgray;
  --my-radius: 6px;
  --my-border: solid 1px #dee2e6;
  --my-padding-odd: 0.35rem;
}
/*************************
*   DEFAULT
*/
html, body {
  height: 100%;
}
/*************************
*   HEADER
*/
.body-header{
  background-color: var(--my-bg-color-header);
}
.body-header .link{
  /*color: var(--css-bg-color-main);*/
}
.body-header .logo{
  width: 160px;
  padding: 0.5rem;
}
.body-header .navbar-toggler{
  background-color: white;
  box-shadow: 0 0 0.5rem 0.2rem  var(--my-color-main) inset;
  padding: 0.75rem;

}
.body-header .nav-link{
  width: 100%;
  padding: 0.8rem;
  margin: 0.125rem;
  border-radius: var(--my-radius);
  /*font-size: 1.1rem;*/
  font-weight: bold;
  color: black;
}
.body-header .nav-link.active{
  background-color: var(--my-color-main);
  color: white;
}
.body-header .nav-link:not(.active):hover{
  background-color: var(--my-bg-color-hover);
  /*color: white;*/
}
/*************************
*   CONTENT
*/
.body-content{
  /*padding: 0.5rem;*/
  background-color: var(--my-bg-color-content);

  /*overflow-x: scroll;*/
  /*background-image:  repeating-linear-gradient(#281c8a, white);*/
}
/*************************
*   FOOTER
*/
.body-footer{
  /*background-color: var(--my-color-main);*/
  color: white;
}
.body-footer .version{
  color: transparent;
}
/*************************
*   GLOBAL
*/
.color-main{
  color: var(--my-color-main);
}
.color-bg-main{
  background-color: var(--my-color-main);
}
.mapa{
  width: 100%;
}
.header-odd,
.footer-odd{
  padding-top: var(--my-padding-odd);
  background-image:  linear-gradient(
    to bottom,
    var(--my-bg-color-header),
    var(--my-color-main)
    );
}
.content-odd{
  padding-top: var(--my-padding-odd);
  background-image:  linear-gradient(
    to bottom,
    var(--my-color-main),
    var(--my-bg-color-content)
    );
}
.body-content-bg{
  background-image:  linear-gradient(
    to bottom,
    var(--my-color-main),
    var(--my-bg-color-header)
    );
}
.parent-row-mb > .row{
  margin-bottom: 1.25rem;
  text-align: center;
}
.row.odd{
  margin-left: 2.5%;
  margin-right: 2.5%;
  border: var(--my-border);
}
p.nadpis{
  margin-bottom: 0.5rem;
  font-weight: bold;
  font-size: 1.1rem;
}
.tbl-data tr:not(:first-child) td{
  padding-top: 0.5rem;
}
.tbl-data td{
  text-align: left;
  vertical-align: baseline;
}
.tbl-data td:first-child{
  text-align: right;
  font-style: italic;
  padding-right: 1rem;
}
.text-frame{
  margin-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}
.text-frame > p{
  text-align: justify;
  text-indent: 1rem;
}
.text-frame h4{
  font-weight: bold;
  /*margin-top: 2rem;*/
  margin-bottom: 1rem;
}
.text-frame > h5{
  /*margin-top: 1rem;*/
  /*margin-bottom: 0.5rem;*/
}
.text-frame ul{
  /*padding-left: 4rem;*/
  /*  padding-top: 0.5rem;
    padding-bottom: 0.5rem;*/
  /*padding-right: 2rem;*/

  /*border-radius: var(--css-radius);*/
  text-align: left;
  font-weight: bold;
}
.text-frame ul > li{
  /*padding-right: 1rem;*/
  color: black;
}
.text-frame .text-ul > li:not(:first-child){
  margin-top: 1rem;
}
.ul-list{
  background-color: var(--my-bg-color-list);
}
.ul-example{
  background-color: var(--my-bg-color-list-example);
}



@media (min-width: 576px) {
  .body-header .nav-link{
    width: auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .body-header .navbar-nav{
    /*text-align: center;*/
  }
  .mapa{
    width: 75%;
  }
}
@media (min-width: 1200px) {
  .mapa{
    width: 50%;
  }
}