body {
font-family: 'Exo', serif, Arial, Verdana, Trebuchet MS, Helvetica, sans-serif; }

.container {
max-width: 1100px !important; }

.grey {
background-color: #efefef; }

.grey_top {
background-image: url('/layout/img/seda.png');
background-position: center top;
background-repeat: no-repeat;
background-size: 100% auto;
min-height: 50px; }

.grey_bottom {
background-image: url('/layout/img/seda.png');
background-position: center bottom;
background-repeat: no-repeat;
background-size: 100% auto;
min-height: 50px; }

#header {
background-image: url('../img/hlavicka.jpg');
background-repeat: no-repeat;
background-position: 50% 100%;
background-size: cover; }

#footer {
background-image: url('../img/paticka.jpg');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: cover;
color: white; }

#footer > .container > .row > div {
margin-bottom: 1.5em;
display: flex;
justify-content: center;
align-items: center; }

.footer_info {
margin-left: 20px; }

#footer a {
color: white; }

.footer_info span {
font-weight: bold; }

#copyright {
font-size: 0.8em; }

#social a {
display: inline-block;
margin-right: 0.5em; }

#social a:hover {
opacity: 0.8; }

#social img {
max-width: 30px; }

#katka {
text-align: right; }

.nav-link {
text-transform: uppercase;
color: white !important; }

.nav-link:hover {
color: white;
opacity: 0.8; }

.nav-link-invert {
margin-left: 20px;
background-color: white;
color: #2d3c6b !important; }

.nav-link-invert:hover {
opacity: 1 !important;
color: white !important;
background-color: #4e4b3d; }

#welcome {
color: white; }

#welcome p {
text-align: justify;
font-size: 1.1em;
font-style: italic; }

#content {
color: #656565;
padding: 2em 0; }

.price_item_note {
font-size: 0.8em;
color: #888; }

.pricelist td {
padding: 0.3em 0; }

.no_bottom_border td {
border-bottom: none !important; }

.button {
display: inline-block;
font-size: 0.8em;
min-width: 150px;
max-width: 300px;
white-space: nowrap;
overflow: hidden;
background-color: white; }

.button:hover {
background-color: #efefef; }

.button_blue {
display: inline-block;
font-size: 0.8em;
min-width: 150px;
max-width: 300px;
white-space: nowrap;
overflow: hidden;
background-color: #2d3c6b;
background-color: #838746;
transition: transform .2s;
color: white; }

.button_blue:hover {
color: white;
background-color: #eeb858;
background-color: #636726; }

.blog_img img {
transition: transform .2s;
border-radius: 20px;
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }

.blog_img img:hover {
transform: scale(1.1); }

.article_img img {
margin-top: 5em;
transition: transform .2s;
border-radius: 20px;
max-width: 100%;
max-height: 100%;
min-width: 100%;
aspect-ratio: 3/2; }

.blog_img img:hover {
transform: scale(1.1); }

.gallery {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 5px; }

.gallery_photo {
overflow: hidden;
box-sizing: border-box;
flex-grow: 1;
transition-duration: 0.5s;
aspect-ratio: 1/1; }

.gallery_photo:hover {
filter: brightness(1.2); }

.gallery_photo img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }

.article {
display: flex;
justify-content: center;
align-items: center; }

.article img {
margin-right: 20px;
aspect-ratio: 1/1;
max-width: 20%; }

#popis {
min-height: 150px; }

h1 {
font-size: 2.0em;
text-transform: uppercase;
color: #4e4b3d; }

h3 {
font-size: 1.2em;
color: #838746; }

#services {}

#services h4 {
font-size: 1.0em;
font-weight: bold; }

#services .icon {
margin-bottom: 1em;
max-width: 40px;
height: auto; }

#services p {
display: none;
font-size: 0.8em; }

#tablet_cover {
display: flex;
vertical-align: center;
align-items: center; }

#services #tablet {
max-width: 100%;
height: auto; }

#quote_top {
background-image: url('/layout/img/citat3.png');
background-position: center top;
background-repeat: no-repeat;
background-size: 100% auto;
min-height: 50px; }

#quote_bottom {
background-image: url('/layout/img/citat3.png');
background-position: center bottom;
background-repeat: no-repeat;
background-size: 100% auto;
min-height: 70px; }

#quote {
background-color: #4e4b3d;
background-color: #8b8f52; }

#quote_katka {
border-radius: 50%;
max-height: 8em;
width: auto; }

.white {
color: white; }

#quote p:first-child {
color: white;
margin-top: 0.5em;
font-style: italic;
font-size: 1.7em; }

#quote span {
display: inline-block;
float: right; }

#ilustration_cover {
display: flex;
vertical-align: center;
align-items: center; }


#ilustration {
margin: 0 auto;
max-width: 100%;
height: auto; }

.more {
text-align: center;
text-decoration: none;
border-radius: 5px;
display: inline-block;
margin-top: 5px;
padding: 5px;
background-color: #efefef; }

.more:hover {
background-color: #dedede; }

.more_hidden {
display: none; }

.bb {
padding: 0.3em 0;
border-bottom: 1px solid #efefef; }

.nowrap {
white-space: nowrap; }

@media (max-width: 575px) {
    #social img {
    margin-right: 0.5em;
    max-width: 33px;
    height: auto; }

    #welcome {
    margin-bottom: 2em;
    text-align: center; }

    #math_academy {
    margin: 0 auto;
    max-width: 90%;
    height: auto; }

    #katka {
    text-align: center; }

    #katka img {
    max-width: 60%; }

    #quote_katka_cover {
    text-align: center; }

    #footer > .container > .row > div {
    display: block;
    margin-top: 0.5em;
    text-align: left; }

    #footer > .container > .row > div img{
    margin: 0 2em;
    float: left; }

    .footer_info {
    margin-left: 20px; }
}

