html {
    background-color: #f8fafc;
    height: 100%;
}

body {
    font-family: "Poppins", sans-serif;
    height: 100%;
}

#app {
    height: 100%;
}

.prepniZobrazeniLink {
    border-style: solid;
  border-color: #ffffff;
}
.card-header {
    background-color: rgb(23, 111, 94);
    color: #ffffff;
    font-size: 23px;
}
.navbar-nav a {
    color: #ffffff !important;
}
.navbar-nav.color-me a {
    color: rgb(23, 111, 94) !important;
}
.dropdown-menu {
    background-color: rgb(23, 111, 94) !important;
}
.dropdown-menu a:hover {
    background-color: rgb(23, 111, 94) !important;
    color: #ffffff !important;
}
.navbar-nav a:hover {
    color: #ffffff !important;
}

.dark-mode {
    background-color: black !important;
    color: white !important;
}

.themeZobrazeni {
    border-style: solid;
    border-color: #ffffff;
}
button.navbar-toggler {
    border-color: #ffffff;
}
span.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.navbar {
    background-color: rgb(23, 111, 94);
}
.navbar-brand {
    color: #ffffff !important;
}
.nav-link {
    color: #ffffff;
}
.dropdown-item {
    background-color: rgb(23, 111, 94);
    color: #ffffff;
}
.zrusitButton {
    background: linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
    background-color: #d0451b;
    border-radius: 4px;
    border: 1px solid #791c07;
    display: inline-block;
    cursor: pointer;
    color: #ffffff !important;
    font-family: Arial !important;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 18px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #854629;
}

.zrusitButton:hover {
    color: #ffffff;
    text-decoration:none;
}
.zrusitButton:active {
    background: linear-gradient(to bottom, #852b10 5%, #8d1f06 100%);
    background-color: #852b10;
    position: relative;
    top: 1px;
    text-decoration:none;
    color: #ffffff;
}
.potvrditButton {
    background: linear-gradient(to bottom, #7cdf4f 5%, #6eb949 100%);
    background-color: #77b55a;
    border-radius: 4px;
    border: 1px solid #4b8f29;
    display: inline-block;
    cursor: pointer;
    color: #ffffff !important;
    font-family: Arial !important;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 18px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #5b8a3c;
}

.potvrditButton:hover {
    color: #ffffff;
    text-decoration:none;
}
.potvrditButton:active {
    background: linear-gradient(to bottom, #56a531 5%, #3d7720 100%);
    background-color: #56a531;
    position: relative;
    top: 1px;
    text-decoration:none;
    color: #ffffff;
}
.zpetButton {
    background: linear-gradient(to bottom, #2dabf9 5%, #0688fa 100%);
    background-color: #2dabf9;
    border-radius: 4px;
    border: 1px solid #075cca;
    display: inline-block;
    cursor: pointer;
    color: #ffffff !important;
    font-family: Arial !important;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 18px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #1949db;
}

.zpetButton:hover {
    color: #ffffff;
    text-decoration:none;
}
.zpetButton:active {
    background: linear-gradient(to bottom, #2485c2 5%, #06579e 100%);
    background-color: #2485c2;
    position: relative;
    top: 1px;
    text-decoration:none;
    color: #ffffff;
}
.photobuttonskin {
    display: block;
    width: 100px;
    height: 100px;
    text-align: center;


    background-image: url("/storage/obrazky/photobutton.png");

}

.photobutton {
    display: block;
    height: 100px;
    width: 100px;
    position: relative;
    border: 2px solid rgb(23, 111, 94); /* Green */
    border-radius: 50%;
    -khtml-border-radius: 90px;
    -moz-border-radius: 90px;
    -webkit-border-radius: 90px;
}


.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.text-block {
    white-space: pre; 
}