/* Základní nastavení */
* {margin: 0; padding: 0;}
*, *:after, *::before {box-sizing: inherit;}
html {
  height: 100%;
  box-sizing: border-box;
  background: #fff;
  color: #323232;
  font-family: 'Sofia', sans-serif;
  font-weight: 400;
}
body {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  font-size: 100%;
}

/* Typography */
b, strong {font-family: 'Sofia', sans-serif; font-weight: 700;}
strong {color: #f49221;}
a, a:visited, a:active {color: #f49221; text-decoration: underline;}
a:hover {text-decoration: none;}
::selection, ::-moz-selection {background: #f49221; color: #fff;}

#eventContent {display: none; font-size: 0.8rem;}
#odsazeny {margin: 1rem auto 1.25rem;}

/* Fonty */
@font-face {
  font-family: 'Sofia';
  src: url('/font/SofiaProLight-webfont.woff2') format('woff2'),
       url('font/SofiaProLight-webfont.woff') format('woff');
  font-weight: 400;
}
@font-face {
  font-family: 'Sofia';
  src: url('font/SofiaProSemiBold-webfont.woff2') format('woff2'),
       url('font/SofiaProSemiBold-webfont.woff') format('woff');
  font-weight: 700;
}
@font-face {
  font-family: 'Montserrat';
  src: url('font/montserrat-light-webfont.woff2') format('woff2'),
       url('font/montserrat-light-webfont.woff') format('woff');
  font-weight: 300;
}
@font-face {
  font-family: 'Montserrat';
  src: url('font/montserrat-regular-webfont.woff2') format('woff2'),
       url('font/montserrat-regular-webfont.woff') format('woff');
  font-weight: 400;
}
@font-face {
  font-family: 'Montserrat';
  src: url('font/montserrat-bold-webfont.woff2') format('woff2'),
       url('font/montserrat-bold-webfont.woff') format('woff');
  font-weight: 700;
}

/* Horní panel */
header {
  width: 100%;
  background: url('https://apartmany-cechovni.cz/img/web/top_bg.png') repeat top center;
  padding: 0 1rem;
}
#logo_menu {
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-content: space-between;
  flex-wrap: wrap;
}

/* Logo */
h1 a {
  max-width: 290px;
  aspect-ratio: 2.9 / 1;
  display: block;
  margin: 0 auto;
  background: url('img/web/logo.png') no-repeat;
  background-size: cover;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-decoration: none;
}
@media (max-width: 450px) {h1 a {max-width: 250px;}}

/* Menu */
nav {
  font-family: 'Sofia';
  font-size: 1.2rem;
  text-align: right;
  display: flex;
  align-items: center;
  gap: 1rem;
}
@media (min-width: 850px) and (max-width: 950px) {
  nav {font-size: 1rem; gap: 0.5rem;}
  #mblnav_btn {display: none;}
}
@media (min-width: 949px) and (max-width: 1065px) {
  nav {font-size: 1.1rem; gap: 0.8rem;}
  #mblnav_btn {display: none;}
}
@media (max-width: 849px) {#main_nav {display: none;}}
@media (min-width: 1051px) {#mblnav_btn {display: none;}}

#main_nav a, nav a:visited {
  transition: color 0.3s;
  position: relative;
  display: inline-block;
  color: #b4b4b4;
  text-shadow: 0.1rem 0.1rem 0 rgba(0,0,0,0.35);
  text-decoration: none;
}
#main_nav a:hover,
#main_nav a:focus,
#main_nav a:visited:hover {color: #fff;}
#main_nav a {padding-bottom: 0.6rem;}
#main_nav a::after {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 0.1rem;
  background: #fff;
  content: '';
  opacity: 0;
  box-shadow: 0.1rem 0.1rem 0 rgba(0,0,0,0.35);
  transition: height 0.3s, opacity 0.3s, transform 0.3s;
  transform: translateY(-0.6rem);
}
#main_nav a:hover::after,
#main_nav a:focus::after {
  height: 0.2rem;
  opacity: 1;
  transform: translateY(0);
}

/* Mobile nav button */
#mblnav_btn a {
  font-size: 2.5rem;
  color: #fff;
  text-decoration: none;
}
#mblnav_btn a:hover {color: #fff;}
#ubytovani_link:hover {cursor: pointer;}

/* Mobile menu */
.mbl_nav {
  width: 0;
  position: fixed;
  z-index: 999;
  height: 100%;
  top: 0;
  right: 0;
  background: url('https://apartmany-cechovni.cz/img/web/top_bg.png') repeat top center;
  overflow-x: hidden;
  transition: 0.5s;
  box-shadow: 0 0 0.5rem rgba(0,0,0,0.3);
}
.mbl_nav a {
  padding: 0.7rem 0 0.7rem 1rem;
  margin: 0 1rem;
  font-size: 1.3rem;
  display: block;
  border-bottom: 0.1rem solid #404040;
  transition: 0.3s;
  color: #818181;
  text-decoration: none;
}
#hasSub::after {content: '\25BC'; position: relative; left: 5rem;}
#hasSub.open::after {content: '\25B2';}
#mblSubNav {
  margin: 0 0 0.5rem 1rem;
  font-size: 1.1rem;
  max-height: 0;
  overflow: hidden;
  transition: 1s;
}
#mblSubNav a {font-size: 1.1rem;}
.mbl_nav .closebtn {
  font-size: 2.5rem;
  padding: 0.5rem;
  text-align: right;
  border: none;
}
.openbtn {cursor: pointer;}


/* Obsah */
main {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto 2rem;
  padding: 0 1rem;
}
main.full {width: 100%;}
main#error {width: 100%; margin: 0 auto; padding: 10rem 0;}

h2 {
  font-size: 3rem;
  text-align: center;
  color: #f49221;
  font-family: 'Sofia';
  margin: 1rem 0;
  font-weight: 400;
}
h3 {
  width: 100%;
  font-size: 2rem;
  text-align: center;
  color: #f49221;
  font-family: 'Sofia';
  font-weight: 400;
  margin: 1.25rem 0 0.3rem;
}
h4 {
  font-size: 1.5rem;
  text-align: center;
  color: #f49221;
  font-family: 'Sofia';
  font-weight: 400;
  margin: 1rem 0 0.3rem;
}
h3.podminky {text-align: left;}
h3.top {margin-top: 21px;}
h3.prvni {margin-top: 0;}
.apartman h3, .u_zakladni h3, .u_vcene h3 {
  text-align: left;
  font-family: "Montserrat";
  color: #323232;
  font-size: 1.5rem;
  margin: 0 0 1rem;
  font-weight: 700;
}
#calendar h3, .fc-left h3 {
  text-align: left;
  font-family: "Montserrat";
  color: #323232;
  font-size: 1.4rem;
  margin: 0;
  font-weight: 700;
}
h4.top {margin-top: 0;}
h5 {
  font-size: 16px;
  text-align: center;
  color: #323232;
  margin: 15px 0 0;
}
h4.left, h5.left {text-align: left;}

@media (max-width: 490px) {
  h2 {font-size: 2.2rem;}
  h3 {font-size: 1.8rem;}
}

p {text-align: justify; margin: 0.5rem 0; font-size: 1rem;}
p.nojustify {text-align: left;}

main#error h2 {
  font-size: 4rem;
  margin: 0 0 1.5rem;
}
main#error p {
  text-align: justify;
  margin: 0 0 0.6rem;
  line-height: 1.6rem;
  font-size: 1.25rem;
}

.smaller {font-size: 0.75rem;}
.center {text-align: center;}

main ul {margin-left: 2rem;}
main ul li {margin: 0.5rem 0; list-style-type: square;}

/* Panely */
.content {
  width: 100%;
  display: flex;
  gap: 0.5rem 1.5rem;
  flex-wrap: wrap;
  justify-content: space-between;
}
.content.centered {justify-content: center;}
.largegap {gap: 1rem 1.5rem;}
.content_wide {min-width: 330px; flex: 2 1 0;}
.content_narrow {min-width: 250px; flex: 1 1 0;}
.vertical {flex-direction: column;}
.nogap {gap: 0;}

@media (max-width: 800px) {
  .content {flex-wrap: wrap;}
  .content_narrow {flex-basis: 100%;}
}

.gray {
  width: 100%;
  background: #f2f2f2;
  padding: 0.5rem 1rem;
  margin: 1rem auto;
}

/* Hlavní strana */
#uvod {display: flex; flex-direction: column;}

.mapa_kontakty {
  width: 100%;
  background-image: url('img/web/uvod_info.png');
  background-size: cover;
  background-position: center center;
  box-shadow: inset 0 0 0 1000px rgba(255,255,255,0.5);
  transition: box-shadow 0.3s linear;
}
.mapa_kontakty:hover {
  box-shadow: inset 0 0 0 1000px rgba(255,255,255,0);
}
.mapa_kontakty a {text-decoration: none;}

#basic_info {
  width: 100%;
  aspect-ratio: 5 / 1;
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: center;
  font-family: 'Montserrat';
  color: #323232;
  text-shadow: 0 0 0.15rem #fff;
}
#basic_info div {
  padding-left: 3rem;
  line-height: 2rem;
  font-size: 1.2rem;
  overflow-wrap: break-word;
  display: inline-block;
  position: relative;
}
a #basic_info {
  text-decoration: none;
  transition: box-shadow 0.3s linear;
}


#basic_info .phone .icon,
#basic_info .address .icon,
#basic_info .mail .icon {
  background-size: cover;
  display: inline-block;
  position: absolute;
  top: 0.25rem;
  left: 1rem;
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.5rem;
}
#basic_info .phone .icon {background-image: url("img/web/phone_icon.png");}
#basic_info .address .icon {background-image: url("img/web/map_pin.png");}
#basic_info .mail .icon {background-image: url("img/web/mail_icon.png");}

@media (max-width: 400px) {#basic_info div {font-size: 1.1rem;}}
@media (max-width: 800px) and (min-width: 450px) {#basic_info {aspect-ratio: 2.8 / 1;}}
@media (max-width: 1000px) and (min-width: 800px) {
  #basic_info div {line-height: 1.5rem; font-size: 0.8rem;}
}

/* Slideshow */
#slideshow {
  width: 100%;
  aspect-ratio: 2.8 / 1;
  box-shadow: 0 0 1.5rem rgba(0,0,0,0.3);
}
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  Margin: 0;
}
.rslides li {
  backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  margin: 0;
}
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}
.rslides div {
  display: block;
  float: left;
  width: 100%;
  aspect-ratio: 2.8 / 1;
  background-position: center;
  background-size: cover;
}

/* Hlavní strana pokračování */
#nazory {width: 100%; display: flex; gap: 2rem 1rem; flex-wrap: wrap;}
.nazor {min-width: 330px; flex: 1 0 calc(33.3% - 1rem);}
.nazor p {margin: 0; padding: 0 1.25rem;}
.quote, .quote_end {font-size: 3rem; color: #f49221;  display: inline-block; vertical-align: bottom;}
.quote {margin: -2rem 0 0 -1.25rem; padding-right: 0.125rem;}
.quote_end {float: right; margin: 0.625rem -1.25rem -2rem 0;}
.nazor p.name {margin: 0.3rem 0 0; text-align: right; font-weight: 700; color: #f49221;}
.nazory_links {width: 100%; text-align: center;}

/* Aktuality */
#aktuality {width: 100%; display: flex; gap: 0.2rem;}
@media (max-width: 799px) {#aktuality {flex-direction: column;}}
#aktuality .aktualita {
  min-width: 200px;
  padding: 1rem;
  background: #f0f0f0;
  flex: 1 0 calc(33.3% - 2rem);
}
.aktualita h5 {
  font-size: 1rem;
  text-align: left;
  font-family: 'Montserrat';
  color: #323232;
  margin: 0;
}
.datum {font-size: 0.7rem; color: #646464; text-align: right; margin: 0 0 0.3rem;}
.aktualne_text p {font-size: 0.9rem;}

/* Stránka apartmanu */
.u_zakladni {width: 100%; display: flex; gap: 1.5rem;}
.u_zakladni .text {width: calc(50% - 0.75rem);}
.u_zakladni .text p {font-size: 1.25rem;}
@media (max-width: 1200px) {.u_zakladni .text p {font-size: 1rem;}}
.u_zakladni .u_images {width: calc(50% - 0.75rem);}
.u_zakladni .u_images #slideshow {width: 100%; overflow: hidden; aspect-ratio: 1.5 / 1;}
.u_zakladni .u_images #slideshow .rslides div {aspect-ratio: 1.5 / 1;}
@media (max-width: 900px) {
  .u_zakladni .u_images #slideshow,
  .u_zakladni .u_images #slideshow .rslides div {aspect-ratio: 2.5 / 1;}
  .u_zakladni .u_images, .u_zakladni .text {width: 100%;}
  .u_zakladni {flex-flow: column-reverse;}
}
@media (max-width: 600px) {
  .u_zakladni .u_images #slideshow,
  .u_zakladni .u_images #slideshow .rslides div {aspect-ratio: 2 / 1;}
}

/* V ceně */
.u_vcene {padding: 1rem 0;}
.u_vcene ul {columns: 4;}
.u_vcene ul li {list-style-type: disc;}
.u_vcene ul li::marker {color: #f49221;}

@media (max-width: 1100px) {.u_vcene ul {columns: 3;}}
@media (max-width: 800px) {.u_vcene ul {columns: 2;}}
@media (max-width: 550px) {.u_vcene ul {columns: 1;}}
.u_vcene ul li {margin: 0 0 0.75rem; padding: 0 0.75rem 0 0;}

/* Ceník */
.cenik_slevy {width: 100%; display: flex; flex-direction: column; gap: 0.5rem;}
.u_cenik {width: 80%; margin: 0 auto;}
@media (max-width: 799px) {.u_cenik {width: 100%;}}

.t_cenik {
  width: 100%;
  margin: 0 auto;
  font-size: 1rem;
  font-weight: 700;
  border-collapse: collapse;
}

@media (min-width: 1050px) and (max-width: 1150px) {.t_cenik {font-size: 0.9rem;}}
.t_cenik thead {background: #f49221; color: #fff;}
.t_cenik thead th {padding: 0.6rem; vertical-align: middle;}
.t_cenik thead .price {text-align: center; border-left: 1px solid #ffa032;}
.t_cenik tbody td {padding: 0.6rem;}
.t_cenik tbody td.first {vertical-align: middle;}
.t_cenik tbody td.price {vertical-align: middle; text-align: center; border-left: 1px solid #eaeaea;}
.t_cenik tbody td.full-centered {vertical-align: middle; text-align: center;}
.t_cenik tbody tr.pozn td {font-size: 0.8rem;}
.t_cenik tbody tr.pozn td.first {font-weight: 700; text-align: right;}
.t_cenik tbody tr.pozn td.price {font-weight: 400; text-align: left;}
.t_cenik tbody tr:nth-child(even) td {background: #f2f2f2;}
.t_cenik tbody tr:nth-child(even) td.price {border-left: 1px solid #dcdcdc;}
.t_cenik thead tr.row_p {background: #323232; color: #fff; text-align: center;}
.t_cenik thead tr.row_p td {padding: 0.6rem;}

.fullsize .t_cenik {font-size: 1.2rem;}

@media (max-width: 900px) {.fullsize .t_cenik {font-size: 1rem;}}


.fullsize .t_cenik thead {background: #f49221; color: #fff;}
.fullsize .t_cenik thead th {padding: 1rem; vertical-align: middle;}
.fullsize .t_cenik thead .price {text-align: center; border-left: 1px solid #ffa032;}
.fullsize .t_cenik tbody td {padding: 1rem;}
.fullsize .t_cenik tbody td.first {vertical-align: middle;}
.fullsize .t_cenik tbody td.pozn {font-size: 1rem;}
.fullsize .t_cenik tbody td.price {vertical-align: middle; text-align: center; border-left: 1px solid #eaeaea;}
.fullsize .t_cenik tbody td.full-centered {vertical-align: middle; text-align: center;}
.fullsize .t_cenik tbody tr:nth-child(even) td {background: #f2f2f2;}
.fullsize .t_cenik tbody tr:nth-child(even) td.price {border-left: 1px solid #dcdcdc;}
.fullsize .t_cenik thead tr.row_p {background: #323232; color: #fff; text-align: center;}
.fullsize .t_cenik thead tr.row_p td {padding: 1em;}

.u_slevy {width: 300px; float: right;}
.u_obsazenost {margin: 0 auto;}

/* Objednávka */
#objednat {width: 100%; margin: 0 auto; text-align: center;}
#objednat a button {
  font-family: "Montserrat";
  font-weight: 400;
  color: #fff;
  font-size: 18px;
  padding: 1rem;
  background: #f49221;
  border: none;
}
#objednat a:hover button {cursor: pointer;}

/* Obsazenost */
#calendar {margin-bottom: 1rem;}

.ui-dialog {background: #fff; border: none;}
.ui-dialog button {
  padding: 7px 10px;
  border: none;
  background: #323232;
  color: #fff;
  font-size: 16px;
  font-family: "Montserrat";
  font-weight: 400;
}
.ui-dialog button:hover {background: #f49221;}

#calendar .fc-time,
#calendar_rodina .fc-time,
#calendar_pohoda .fc-time,
#calendar_styl .fc-time,
#calendar_garaz .fc-time,
#calendar_svoboda .fc-time,
#calendar_nebe .fc-time,
#calendar_ticho .fc-time,
#calendar_sen .fc-time {display: none;}

/* Cenik layout */
.cenik {width: calc(50% - 0.75rem); display: flex; flex-direction: column; gap: 0.5rem;}
.cenik.fullsize {width: 80%}
.cenik p.center {width: 100%; margin-top: auto; align-self: flex-end;}
@media (max-width: 1049px) {
  .cenik {width: 80%;}
  .cenik p.center {align-self: auto;}
}
@media (max-width: 799px) {.cenik, .cenik.fullsize {width: 100%;}}
.t_cenik.dodatky tbody td.price {text-align: left;}

/* Volný čas */
.vc_foto {display: flex; flex-direction: column; gap: 2rem;}
.vc_foto .foto {position: relative;}
.vc_foto img {max-width: 100%; box-shadow: 0 0 1.5rem rgba(0,0,0,0.3);}
.vc_foto a {text-decoration: none;}
.vc_foto a .foto span {
  width: 100%;
  position: absolute;
  bottom: 0.25rem;
  left: 0;
  margin: 0;
  text-align: center;
  padding: 0.5rem;
  display: block;
  color: #fff;
  background: rgba(0,0,0,0.5);
}

/* Kontakt */
.kontakt_content {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
  flex: 1 0 calc(50% - 2.5rem);
}
.kontakt_content.double {
  min-width: 100%;
  justify-content: center;
  margin-bottom: 2rem;
}
.kontakt_content.double div {flex: 1 0 calc(40% - 1rem);}
.kontakt_content.double .kontakt_map {flex: 2 0 calc(60% - 1rem);}
.kontakt_content.double .kontakt_map .mapa {aspect-ratio: 2 / 1;}
.kontakt_content .column {
  flex: 1 0 calc(50% - 1rem);
  display: flex;
  flex-direction: column;
  align-self: flex-end;
}
.kontakt_content .column #dvesestry_logo {width: 50%;}
.kontakt_content .column #slunecna_logo {width: 85%;}

.mapa {aspect-ratio: 1 / 1; box-shadow: 0 0 1.5rem rgba(0,0,0,0.3);}
dl dt {margin-top: 0.6rem;}
dl dd {margin: 0.2rem 0 0.2rem 1.25rem; color: #f49221;}

.directions {
  width: 100%;
  height: 6rem;
  margin-top: 0.5rem;
  position: relative;
  overflow: hidden;
}
.directions form {width: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
.dir_button {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 6rem;
  font-family: "Sofia";
  color: #fff;
  font-size: 1.5rem;
  font-weight: 400;
  padding: 0.6rem;
  background: #f49221;
  border: none;
}
.dir_button:hover {cursor: pointer;}

.directions input {
  width: 100%;
  padding: 0.7rem;
  font-family: "Sofia";
  font-weight: 400;
  color: #323232;
  font-size: 1rem;
  border: 1px solid #c8c8c8;
}
.directions input.button {
  background: #323232;
  color: #fff;
  border: none;
  margin-top: 0.4rem;
}
.directions input.button:hover {background: #f49221;}

#dvesestry h3, #dvesestry a, #dvesestry a:hover {color: #3c0014}
#aptcech h3, #aptcech a, #aptcech a:hover {color: #c80000;}

@media (min-width: 800px) and (max-width: 999px) {
  .kontakt_content {width: 80%; margin: 0 auto; flex: 0 0 auto;}
}
@media (min-width: 600px) and (max-width: 799px) {
  .kontakt_content {width: 100%; margin: 0 auto; flex: 0 0 auto;}
  .kontakt_content.double .kontakt_map .mapa {aspect-ratio: 1.5 / 1;}
}
@media (min-width: 500px) and (max-width: 599px) {
  .kontakt_content {width: 100%; margin: 0 auto; flex: 0 0 auto;}
  .kontakt_content.double .kontakt_map .mapa {aspect-ratio: 1 / 1;}
  .kontakt_content.double div,
  .kontakt_content.double .kontakt_map {flex: 1 0 calc(50% - 1rem);}
}
@media (max-width: 499px) {
  .kontakt_content.double {justify-content: flex-start;}
  .kontakt_content {flex-direction: column;}
  .kontakt_content .column {align-self: auto;}
  .mapa, .kontakt_content.double .kontakt_map .mapa {aspect-ratio: 3 / 1;}
}

/* Formuláře */
#form {
  margin: 0 auto 1rem;
  width: 100%;
  max-width: 800px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
#form .row {
  width: 100%;
  font-size: 1rem;
  font-weight: 700;
  display: flex;
  gap: 1.5rem;
  align-items: center;
}
#form .row .popisek {width: calc(30% - 0.75rem); text-align: right;}
#form .row .nepovinne {font-weight: 400;}
#form .double {justify-content: center;}
#form .button {justify-content: flex-end;}
#form th.big {text-align: center; padding-top: 1rem;}
#form th.big2 {text-align: center;}
.little {font-weight: normal; color: #646464; font-size: 0.8rem;}
#form td {padding: 0.3rem 0;}

input, textarea, select, button {outline: none;}

#form input,
#form select {
  width: calc(70% - 0.75rem);
  padding: 0.5rem 0.6rem;
  border: 1px solid #c8c8c8;
  color: #323232;
  font-family: "Sofia";
  font-weight: 400;
  font-size: 1rem;
}
#form input.antispam {width: 13.5rem; text-align: center;}
#form input.datum {width: 7.5rem; text-align: center;}
#form input[type=radio],
#form input[type=checkbox] {width: auto; margin: 0 0.625rem 0.625rem 0;}
#captcha {border: 1px solid #c8c8c8;}
#form textarea {
  width: 100%;
  max-width: 100%;
  padding: 0.5rem 0.6rem;
  resize: none;
  border: 1px solid #c8c8c8;
  color: #323232;
  font-family: "Sofia";
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.3rem;
  box-sizing: border-box;
}
#form input:focus,
#form textarea:focus,
#form select:focus {border: 1px solid #969696; color: #000;}
#form input.button {
  float: right;
  width: 8rem;
  padding: 0.5rem 0.6rem;
  border: none;
  background: #323232;
  color: #fff;
  font-size: 1rem;
  font-family: "Sofia";
  font-weight: 400;
}
#form input.button:hover {background: #f49221;}
#form input.file {border: none;}
#form input.checkbox {width: auto; margin: 0 5px;}

.error {color: #f49221; text-align: center; font-weight: 700;}
.success {color: #00c800; text-align: center; font-weight: 700;}

@media (max-width: 699px) {
  #form .row {gap: 0.5rem; flex-direction: column;}
  #form .row .popisek {width: 20rem; text-align: left;}
  #form .row .centered {text-align: center;}
  #form input, #form select {width: 20rem;}
  #form input.antispam {width: 13.5rem;}
  #form input.datum {width: 7.5rem;}
  #form textarea {width: 20rem;}
}

/* Footer */
footer {
  width: 100%;
  padding-top: 1rem;
  background: url('https://apartmany-cechovni.cz/img/web/top_bg.png') repeat top center;
  color: #b4b4b4;
  font-size: 0.8rem;
  font-family: 'Sofia';
  margin-top: auto;
}
footer .footer_content {
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem 0;
}
.footer_column {flex: 1 1 0; width: 0;}

#footer_logo a {
  width: 80%;
  background-image: url('img/web/footer_logo.png');
  background-size: cover;
  background-position: top;
  display: block;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  aspect-ratio: 10 / 1;
}
#footer_logo a:hover {background-position: bottom;}

#copyright {padding-top: 1rem;}
#admin-link a {color: #646464; text-decoration: none;}
#admin-link a:hover {color: #aaa;}

#socials {text-align: center;}
#fb_link {
  aspect-ratio: 1 / 1;
  max-width: 50px;
  background-size: cover;
  display: inline-block;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#fb_link {background-image: url('https://apartmany-cechovni.cz/img/web/fb_icon.png');}

.goog-te-combo {
    width: 100% !important;
    font-family: 'Sofia' !important;
    font-size: 1rem !important;
    padding: 0.5rem !important;
}

@media (max-width: 699px) {.goog-te-combo {width: 90% !important;}}

#translator {
  width: 140px;
  margin: 1rem auto 0;
  text-align: center;
  padding-top: 20px;
}
footer img {border: none;}
footer a:hover img {border: none;}

footer h6 {
  font-size: 1.2rem;
  font-family: 'Sofia';
  font-weight: 400;
  text-align: center;
  margin: 0 auto 1rem;
}
#footer_cechovni {
  width: 49%;
  background-image: url('img/web/cechovni_footer.png');
  background-size: cover;
  background-position: top;
  display: inline-block;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  aspect-ratio: 4.7 / 1;
}
#footer_dvesestry {
  width: 49%;
  background-image: url('https://apartmany-cechovni.cz/img/web/dvesestry_footer.png');
  background-size: cover;
  background-position: top;
  display: inline-block;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  aspect-ratio: 3 / 1;
}

@media (max-width: 799px) {#footer_info {display: none;}}
@media (min-width: 700px) and (max-width: 950px) {#footer_logo a {width: 95%;}}
@media (max-width: 699px) {
  footer .footer_content {flex-direction: column; text-align: center;}
  .footer_column {width: 100%; margin: 0 auto;}
  #footer_logo a {margin: 0 auto;}
  #fb_link {margin: 0 0.5rem;}
}

/* Google Calendar */
.fc-event {font-weight: 400;}


/* Default Plogger theme by Mike Johnson */

/* Body and general styles */
form {display: inline;}

img {display: inline;}

input.submit {
	background-color: #369;
	background-image: url("images/blue-button-bg.gif");
	background-repeat: repeat-x;
	border: none;
	color: #fff;
	font-size: 85%;
	font-weight: normal;
	padding: 3px 5px;
	cursor: pointer;
	width: auto;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-khtml-box-sizing: content-box;
	box-sizing: content-box;
}

table {
	border: 0;
	padding: 0;
}

/* Page Structure */

#plog-wrapper {
  width: 100%;
	margin: 0 auto;
}

/* Menu Structure/Elements */

#breadcrumbs {
  margin: 0;
  padding: 0.7rem;
  font-size: 1rem;
  font-weight: 700;
  background: #f49221;
  color: #fff;
}
#breadcrumbs a {color: #f4cccc;}
#breadcrumbs a:hover {color: #fff;}

#breadcrumb-table {width: 100%;}

#breadcrumb-links {display: flex; gap: 0.5rem; list-style: none;}

/* Content Structure/Elements */

#thumbnail-container { /* this is the div that contains all the thumbnails in collection/album view */
	margin: 0.5rem auto;
	width: 100%;
}

#overlay { /* this is the blue box that shows the total comments when hovering on a thumbnail in album view */
	position: absolute; 
	visibility: hidden; 
	background-color: #38c;
	font-weight: bold;
	padding: 4px;
	text-align: center;
	width: 18px;
	color: #fff;
}

ol.slides { /* this is the overall thumbnail container in collection/album view */
	margin: 0.7rem auto 0 auto;
	padding: 0;
	list-style: none;
}

.slides li { /* this is the individual thumbnail container in collection/album view */
	display: block;
	float: left;
	padding: 0;
}

.tag { /* this controls the text under a thumbnail in collection/album view with caption/download checkbox */
	text-align: center;
	white-space: normal;
}

#caption-date-table, #prev-next-table { /* containers for the caption, date and prev/next links above the large image in picture view */
	width: 100%;
	margin: auto;
}

#picture-caption, .date { /* this controls the caption and date above the large image in picture view */
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.3rem;
	background-repeat: no-repeat;
	text-transform: uppercase;
	letter-spacing: 0.25rem;
	margin-left: 0.25rem;
	padding-bottom: 0.125rem;
}

#prev-link-container {
	width: 50%; 
	text-align: left;
}

#next-link-container {
	width: 50%; 
	text-align: right;
}

#prev-button, #next-button {

}

a.nav-link-img-prev {
	background-image: url("images/rewind.gif");
	background-repeat: no-repeat;
	background-position: left 1px;
	padding-left: 20px;
	width: 40px;
}

a.nav-link-img-next {
	background-image: url("images/fforward.gif");
	background-repeat: no-repeat;
	background-position: right 1px;
	padding-right: 20px;
	width: 40px;
}

#picture-holder {
	text-align: center;
}

#picture-holder a:hover img{
	border: 1px solid #38c;
}

#picture-holder #description {
	width: 625px;
	margin: 15px auto;
}

.photos {
	margin: 3px;
  border: 1px solid #323232;  
}

.photos-large {
	margin: 4px;
  border: 1px solid #323232;
}

.thumbnail img {
	text-align: center;
	margin: 3px;
  border: 1px solid #323232;
}

#error-404, #no-pictures-msg {
	margin: 50px 75px;
	text-align: justify;
}

/* Form Structure/Elements */

#jump-menu {
	text-align: right;
}

#download-selected {
	float: right;
	text-align: right;
}

#search-box {
	text-align: right;
}

#jump-search-container {
	text-align: right; 
	vertical-align: middle;
}

#sortby-container {
	text-align: right; 
	white-space: nowrap;
}

.align-right {
	text-align: right;
}

.nomargin {
	margin: 0;
}

/* Footer Structure/Elements */

#pagination {
	padding: 2px;
	margin: 0;
	clear: both;
}

#pagination-table {
	width: 100%;
}

/*.page-link {
	padding-right: 3px;
	padding-left: 3px;
	text-decoration: none;
}*/

.page-link a:focus {
	outline: none;
	-moz-outline: none;
}

/*a.pagPrev, a.pagNext {
	color: #bbb;
	text-decoration: none;
	margin: 0 2px;
}

a.pagPrev:hover, a.pagNext:hover {
	color: #777;
	text-decoration: none;
}*/

#stats {
	font-size: 85%;
	text-align: center;
	padding: 8px 5px 0 5px;
	margin: 0;
}

/* Exif data container structure*/

#exif-toggle {
	width: 100%; 
	text-align: center;
	padding: 0;
	margin: 0;
}

#exif-data-container {
	width: 550px;
	margin: 10px auto;
	text-align: center;
	padding: 10px;
}

#exif-table {

}

#exif-data td.exif-label {
	text-align: right;
	padding-right: 10px;
	font-weight: bold;
	width: 50%;
}

#exif-data td.exif-info {
	text-align: left;
	padding-right: 10px;
	width: 50%;
}

#exif-data {
	margin: 10px auto;
	padding: 20px;
	text-align: left;
	width: 70%;
	border: 1px solid #ddd;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #f7f7f7;
}

/* Slideshow Elements */

.large-thumb-toolbar {
	text-align: center;
	padding-top: 15px;
	padding-bottom: 5px;
	margin: auto;
}

/* Success/Error Messages */

.actions, .errors {
	width: 500px;
	background-repeat: no-repeat;
	background-position: 5px 8px;
	margin-bottom: 15px;
	padding: 8px 8px 8px 28px;
	padding-left: 28px;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.actions {
	background-image: url("images/alert.gif");
	border: 1px solid #bb0;
	background-color: #ffffe0;
}

.errors {
	background-image: url("images/x.gif");
	border: 1px solid maroon;
	background-color: #fcc;
}

.field-error {
	border: 1px solid maroon;
	background-color: #fcc;
}

.gallery_link a {font-size: 16px; text-decoration: none;}