body {
padding: 0;
margin: 0;
color: #696161;
font-size: 1em;
font-family: "Red Hat Display", sans-serif;
line-height: 1.75em; }

/* header */
#header {
color: white;
background-color: black; }

#home {
color: white;
background-repeat: no-repeat;
background-size: 100% auto;
background-position: 100% 0%;
height: 450px;
background-color: black; }

#header {
background-position: 100% 50%;
background-repeat: no-repeat;
background-size:  auto 100%; }

#header .button, #home .button {
width: auto;
padding: 8px 20px;
margin: 0 auto; }

#header #flag {
display: none; }

#logo {
max-width: 185px;
height: auto; }

#title h1 {
font-size: 3.0em; }

#title h2 {
font-size: 2.0em; }

.navbar-nav > li .nav-link {
color: white !important; }

.navbar-nav > li > .dropdown-menu {
background-color: rgba(255,255,255,0.8); }

.nav-item {
padding: 0 1em; }

.navbar-toggler {
font-size: 3.0em;
color: white; }

/* tables */
.my-table {
width: 100%; }

.my-table tbody tr {
border-bottom: 1px solid #E8E8E8; }

.my-table th, .my-table td {
padding: 1em; }

th {
color: black;
position: relative;
background-color: #F5F4F0; }

thead th:first-child {
border-radius: 16px 0 0 16px; }

.my-table thead th:last-child {
border-radius: 0 16px 16px 0; }

.my-table thead div div {
line-height: 0;
display: inline-block;
margin-left: 10px;
width: 15px; }

.my-table thead div img:first-child {
margin-bottom: 3px; }

/* footer */
#footer {
color: white;
background-color: black; }

#footer p {
line-height: 1.3em; }

#footer img {
height: 145px; }

#footer a {
color: #A2A2A2;
text-decoration: none;
display: block; }

#copyright {
border-top: 1px solid #363636; }

/* index */
#calendar {
position: relative;
margin-top: -120px;
color: #43403A !important;
background-color: #eaf4ff; }

.index-title {
padding: 0.5em 0;
font-size: 1.2em;
font-weight: bold; }

#index-title-exhibitions {
background-image: url('../img/index-ico1.png');
background-repeat: no-repeat;
background-position: 90% 50%;
background-color: #eaf4ff;
background-size: auto 100%; }

#index-title-actions {
background-image: url('../img/index-ico2.png');
background-repeat: no-repeat;
background-position: 90% 50%;
background-color: #eaf4ff;
background-size: auto 100%; }

.calendar-date {
width: 110px;
text-align: center;
padding: 0.25em 0;
margin: 5px 15px 5px 0;
display: inline-block;
background-color: white;
border-radius: 8px; }

.calendar-list > div {
max-width: 90%;
border-bottom: 1px solid rgba(0,94,158,0.1); }

.calendar-list div:last-child {
border-bottom: none; }

#club {
background-image: url('../img/club-bg.jpg');
background-repeat: no-repeat;
background-position: 100% 100%;
background-size: auto 90%;  }

/* rodokmen */
.genealogy {
border-radius: 8px;
display: flex; }

.gen_col {
border-right: 5px solid white;
overflow: hidden;
flex: 1 1 0;
width: 0; }

.gen_cell {
background-color: #EAF4FF;
border-bottom: 5px solid white;
white-space: nowrap;
align-items: center;
display: flex;
align-items: center;
align-content: center;
width: 100%;
padding: 0 0.5em;
border-radius: 8px;
box-sizing: border-box; }

.gen_cell2 {
padding: 0 !important; }

.gen_g1 {
height: 4em; }

.gen_g2 {
display: flex;
height: 8em; }

.gen_g3 {
display: flex;
height: 16em; }

.gen_g4 {
display: flex;
height: 32em; }

.gen_g5 {
display: flex;
height: 64em; }

.gen_cell p {
margin: 0px; }

.fictitious > .gen_col:first-child {
xdisplay: none; }

/* forms */
form {
background-color: #eaf4ff;
border-radius: 16px; }

select, textarea {
background-color: white !important;
border: 1px solid #C7E1FE  !important; }

.form-required label {
font-weight: bold; }

button {
border-style: solid; }

/* galleries */
.gallery {
align-items: center;
display: grid;
grid-template-columns: 1fr;
gap: 5px; }

.advert-photo img,
.gallery img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }

.photo {
aspect-ratio: 1/1;
overflow: hidden; }

.photo:hover {
filter: brightness(1.2); }

/* advert */
.advert {
border-radius: 16px;
background-color: #f5f4f0; }

.advert-photo {
display: inline-block;
max-width: 120px;
border-radius: 6px; }


/* dog detail */
.detail label {
min-width: 150px;
font-weight: bold; }

.detail_photo_main {
width: 344px;
display: inline-block;
aspect-ratio: 3/2; }

.detail_photo {
display: inline-block;
overflow: hidden;
width: 170px;
height: auto;
aspect-ratio: 3/2; }

.detail_photo_main img,
.detail_photo img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }

/* articles */
.article {
display: flex; }

.article-image {
aspect-ratio: 1.5/1;
display: none; }

.article-image img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }

.article-intro {
padding: 1em; }

.article-intro i {
color: grey; }

.article_detail_image {
max-width: 75%;
height: auto; }

.article-button {
display: inline-block;
margin-right: 10px;
background-color: #FFEDEA;
padding: 0.5em 1em;
border-radius: 4px; }

a.article-button:hover {
background-color: #eedcd9;
text-decoration: none !important; }

.article-button i {
display: inline-block;
margin-right: 10px;
font-size: 1.2em; }

.article-gallery {
align-items: center;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 5px; }

.article-gallery img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }

.article-photo {
aspect-ratio: 1.5/1;
overflow: hidden; }


.more {
background-image: url('../img/more.svg');
background-position: 100% 50%;
background-size: auto 75%;
background-repeat: no-repeat;
padding-right: 25px; }

/* common */
.content_grey {
background-color: #F5F4F0; }

.content a {
text-decoration: none;
color: #E31B1B; }

.content a:hover {
text-decoration: underline; }

.content h2 {
color: black; }

.content h3 {
font-size: 1.25em; }

.archive {
border-bottom: 3px solid rgba(0,0,0,0.2); }

.button {
display: inline-block;
white-space: nowrap;
text-align: center;
min-width: 150px;
overflow: hidden;
font-size: 0.9em;
text-decoration: none;
color: white !important;
text-align: center;
margin: 0.5em 0.5em;
padding: 0.75em 1em;
border-radius: 12px;
background-color: #E31B1B; }

.button:hover {
text-decoration: none !important;
background-color: #d30B0B; }

.button-big {
line-height: 1.4em;
padding: 0.75em 3em;
text-decoration: none;
display: inline-block;
white-space: nowrap;
background-color: #EAF4FF;
border-radius: 12px;
text-align:center; }

.button-big b {
font-size: 1.2em; }

.button-big:hover {
text-decoration: none !important;
background-color: #DAE4EF; }

.button-small {
min-width: 0px; }

.alert {
text-align: center;
border-radius: 16px; }

.alert i {
margin: 0 10px; }

.error {
color: #E31B1B;
background-color: #FFEDEA; }

.success {
color: #29bb29;
background-color: #EDFFEA; }

.warning {
color: #777777;
background-color: #f7e79b; }


.border-top {
border-top: 1px solid #bfd8f4; }

.bigger {
font-size: 1.2em; }

.opacity {
opacity: 0.5; }

.sticky {
position: sticky;
top: 0px;}

.hidden {
display: none; }

/* pagination */
.strankovani {
display: inline-block;
aspect-ratio: 1/1;
text-align: center;
background-color: #eaf4ff;
border-radius: 3px;
width: 25px; }

.strankovani:hover {
background-color: #bad4df;
text-decoration: none !important; }

.strankovani-aktivni,
.strankovani-aktivni:hover {
color: white !important;
background-color: #dc3545; }


@media only screen and (min-width: 600px) {
    .gallery {
    grid-template-columns: 1fr 1fr; }

    .article-gallery {
    grid-template-columns: 1fr 1fr 1fr; }
}

@media only screen and (min-width: 900px) {
    .article-image {
    flex: 0 0 25%;
    display: block; }

    .gallery {
    grid-template-columns: 1fr 1fr 1fr; }

    .article-gallery {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }

    .article_detail_image {
    max-width: 75%; }
}

a.btn-danger {
color: white; }

.fa-cross {
opacity: 0.5; }

