.cdig {
	font-size: x-large
}
.orna {
	height: 90%;
}

.orna {
  opacity: 0.55;
}

@media (max-width: 575.98px) {
  .orna {
    display: none;
  }
}

.cntr img {
  display: block; /* Ustawiamy obrazek jako blokowy */
  margin-left: auto;
  margin-right: auto;
}

/* Styl domyślny, gdy szerokość ekranu jest większa niż 600px */
.w50 {
  width: 50%;
}

/* Styl dla ekranów o szerokości mniejszej niż 600px */
@media (max-width: 599px) {
  .w50 {
    width: 100%;
  }
}

.w75 { width: 75% } 
.o50 { opacity: 0.55 }

.grid-item { width: 380px; margin-left: 10px; margin-right:10px; }
.grid-item--width2 { width: 400px; }
* {
        font-size:18px;
}

body {
	background-color:#444;
	height:100%;
        padding:0px;
	line-height:1.35;
 }

p {
	line-height:1.45;
}

.container {
        /* background-color:white; */
}
h1,h2,h3,h4,h5 {
        font-weight:700;
}

a.person {
cursor: pointer;
font-weight: bold;
color: #888; 
text-decoration: none; 
}

div.grave div.card-text:last-child {
    border-bottom: 1px solid black;
}
div.grave div.card-text:nth-child(even) {
background-color: #eeeeee;
}
div.grave div.card-text:nth-child(odd) {
background-color: #e2e2e2;
}
div.card {
background-color: #222;
color: white;
}

div.card,#tdlogo,#hplogo,#ragiel {
    transform: scale(1);
    transition: transform 1s ease; /* Faster transition for scaling down */
}

div.card:hover {
    transform: scale(1.03);
    transition: transform 0.3s ease; /* Slower transition for scaling up */
}
#hplogo:hover, #tdlogo:hover, #ragiel:hover {
    transform: scale(1.04);
    transition: transform 0.3s ease; /* Slower transition for scaling up */
}

#mapasvg > svg polygon {
    stroke: none; /* Black stroke */
    stroke-width: 1px; /* Adjust the stroke width as needed */
    transition: 1.3s ease; /* Slower transition for scaling up */
}

#mapasvg > svg polygon:hover {
    fill: #888889; /* Yellow color */
    stroke: black; /* Black stroke */
    stroke-width: 2px; /* Adjust the stroke width as needed */
    transition: 1.3s ease; /* Slower transition for scaling up */
}


div.card-text {
padding: 2px;
}
a.grave, a.grave_on_map {
cursor: pointer;
font-weight: bold;
color: #999999; 
text-decoration: none; 
}
a.person {
font-size: larger; 
}

table tr:nth-child(odd) {
background-color: #e2e2e2;
font-size: 10px;
}
table {
border-collapse: collapse;
}

table th:first-child {
width: auto;
background-color: #eeeeee;
white-space: nowrap;
text-align: center;
}
table td:nth-child(1) {
/* width: 20%; */
}
table td:nth-child(2) {
/* width: 40%; */
}
table td:nth-child(3) {
width: 40%;
}
table td:nth-child(4) {
/* width: 20%; */
}

table th,
table td {
font-family:'Cormorant Garamond', serif;
font-weight: 500;
	font-size: 20px;
}

#map > div.leaflet-pane.leaflet-map-pane > div.leaflet-pane.leaflet-popup-pane > div > div.leaflet-popup-content-wrapper > div > b
{
font-family:'Cormorant Garamond', serif;
	font-size: 24px;
}

.grave-image {
  opacity: 0.92;
background-image: url('/pub/assets/images/bg3a.jpg');
  background-repeat: repeat;
  background-attachment: fixed;
  background-position: center top;
background-size: auto;
}

 figure > svg > a > text
{
font-size: 120px;
}

#svg-container svg a text {
  font-size: 44px;
}


#svg-container > svg > a:nth-child(2) > text:nth-child(3) 
{
  font-size: 44px;
}

a {
  color: #a48b78; /* Jasny sepia tone */
  text-decoration: none; /* Usuwa podkreślenie */
}

a:hover {
  color: #95776a; /* Nieco ciemniejszy odcień sepia dla stanu hover */
  text-decoration: underline; /* Dodaje podkreślenie przy hover */
}

a:visited {
  color: #b9a597; /* Bardzo jasny odcień sepia dla odwiedzonych linków */
}

a:active {
  color: #80685a; /* Ciemniejszy i bardziej nasycony odcień sepia dla aktywnych linków */
}

/* Podstawowe style dla klasy .matching-person */
.matching-person {
    padding-left: 8px;
    border-radius: 5px;
    font-size: larger;
}

/* Style dla większej czcionki */
.lg-font {
    font-size: x-large;
}

/* Style dla klasy .inter */
.inter {
    width: 250px;
    margin-left: 10em;
}

/* Style dla elementu <li> */
li {
    margin-top: 10px;
}

/* Style dla elementu <p> */
p {
    margin: 0px;
}

/* Style dla elementu <hr> */
hr {
    margin: 2px;
    padding: 6px 20px 0px 20px;
}

/* Style dla czcionki Cormorant Upright */
.corm {
    font-family: Cormorant Upright;
}

/* Style dla klasy .cm */
.cm {
    font-family: Cormorant Upright;
    padding: 20px;
}

/* Style dla klasy .grave */
.grave {
    border: solid 5px #333;
    border-radius: 5px;
    margin-top: 3px;
    padding-top: 0px;
}

/* Style dla klasy .info */
.info {
    padding: 10px;
    margin-bottom: 20px;
}

/* Style dla elementów z klasą .click-me */
.click-me {
    cursor: pointer;
}

/* Style dla klasy .grave-head */
.grave-head {
    border-bottom: 2px solid #554;
    color: #998;
    cursor: pointer;
    text-align: right;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 7px;
}

/* Style dla elementów z klasą .matched .name */
.matched .name {
    font-size: x-large;
    font-weight: 400;
}

/* Style dla elementów z klasą .matched i .not-matched */
.matched,
.not-matched {
    padding-top: 7px;
    cursor: pointer;
}

/* Media Queries dla urządzeń o szerokości do 768px */
@media (max-width: 768px) {
    .matched,
    .not-matched {
        padding-top: 10px; /* lub inną wartość, którą chcesz ustawić */
    }
}

/* Styl dla .not-matched, który wykorzystuje pseudo-element ::before */
.matched-div + .not-matched::before {
    margin-top: 10px;
    margin-bottom: 3px;
    content: "";
    display: block;
    border-bottom: 2px solid #666;
    width: 90%;
    position: relative;
    top: -2px;
}

/* Style dla elementów z klasą .not-matched i .other-person */
.not-matched,
.other-person {
    color: #788;
    padding-left: 16px;
    border-radius: 5px;
    font-size: xx-small;
}

/* Style dla elementów z klasą .person-name */
.person-name {
    font-weight: bold;
    display: inline-block;
    cursor: pointer;
}

/* Style dla elementów z klasami .born-data, .death-data, i .age-data */
.born-data,
.death-data,
.age-data {
    display: inline-block;
    margin-right: 10px;
}

/* Styl dla nieparzystych div-ów z klasą .grave */
.grave:nth-child(odd) {
    background-color: #f2f2f2; /* szary kolor tła */
}

/* Styl dla parzystych div-ów z klasą .grave */
.grave:nth-child(even) {
    background-color: #e0e0e0; /* ciemniejszy szary kolor tła */
}

/* Media Queries dla urządzeń o szerokości do 576px */
@media (max-width: 576px) {
    .full-width {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .full-width .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .full-width .col-sm-12 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Media Queries dla urządzeń o szerokości co najmniej 768px */
@media (min-width: 768px) {
    /* Zmienia szerokość obrazka na 40% szerokości ekranu */
    .responsive-image {
        width: 40%;
    }
}

@media (max-width: 768px) {
    /* Zmienia szerokość obrazka na 80% szerokości ekranu */
    .responsive-image {
        width: 80%;
    }
}