* {
  box-sizing: border-box;
}
body {
    font-family: Helvetica, Arial, Sans-Serif;
    background-image: url(images/pozadi3.png);
    background-repeat: repeat;
    height: 100%;
}

/*Rozdělený index*/
.cela_stranka {
    position: relative;
    //min-height: 100%;
    overflow: hidden;    
} 
.left {
  //background-color: #2196F3;
  padding: 20px;
  float: left;
  width: 10%; /* The width is 20%, by default */
  max-height: none;
}
.main {
    padding: 30px;
    float: left;
    width: 54%; /* The width is 60%, by default */
    //max-width: 1095px;
    //border: 1px solid black;
    background-color: rgb(255,255,255);
    border-radius: 10px 0px 0px 10px;
    box-shadow: 0 2px 6px rgb(100 100 100 / 30%);
    min-height: 470px;
    min-width: 358px;
}
.right {
    padding: 20px;
    float: left;
    width: 26%; /* The width is 20%, by default */
    //border: 1px solid black;
    background-color: rgb(255,255,255); 
    border-radius: 0px 10px 10px 0px;
    box-shadow: 0 2px 6px rgb(100 100 100 / 30%);
    min-height: 470px;
    min-width: 358px;
    margin-left: 20px;
}

/* Use a media query to add a break point at 800px: */
@media screen and (max-width: 1095px) {
    .main, .right, .odkazy {
        width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
    }
    .main {
        border-radius: 10px 10px 0px 0px;
        margin-bottom: 20px;
        min-height: 100px;
    }
    .left {
        display: none;
    }
    .right {
        border-radius: 0px 0px 10px 10px;
        margin-bottom: 10px;
        margin-left: 0px;
    }
    .index-footer {
        position: relative;
        left: auto;
        height: auto;
        bottom: auto;
        //margin-bottom: -40px;
        width: 100%;
        min-height: 55px;
    }
    ul {
        padding-left: 0%;
    }
    .index-footer-tvurce {
        font-size: 14px;
    }
    .ordinacni_doba-objednani {
        font-size: 14px;
    }
}

/*hlavička - index*/
.index-hlavicka {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    //background-color: rgba(116,169,248, 0.8);
    color: rgb(64,64,64);
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}
.index-hlavicka-cara {
    //width: 980px;
    width: 100%;
    border: 1px solid rgb(141,226,255);
}
.index-jmeno {
    font-size: 28px;
    font-weight: bold;
}

.hr-ordinacni-doba {
    //width: 265px;
    width: 100%;
    border: 1px solid rgb(141,226,255);
    margin: 15px 0px 15px 0px;
}

/*Menu*/
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: rgba(141,226,255, 0.8);
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    width: 100%;
    padding-left: 10%;
}
li {
    float: left;
}
li a {
    display: block;
    color: black;
    text-align: center;
    margin: auto;
    padding: 14px 16px;
    text-decoration: none;
}
li a:hover:not(.active) {
  background-color: rgba(102,204,255, 0.8);
}
li a.active {
    background-color: rgba(141,226,255, 0.8);
    //height: 17px;
}

/*Index text*/
.index-text {
    font-size: 18px;
    padding-bottom: 15px;
    display: inline-block;
}

/*Ordinační doba*/
.ordinacni_doba-nadpis {
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 10px;
    display: inline-block;
}
.ordinacni_doba-adresa {
    font-size: 18px;
    font-weight: bold;
    display: inline-block;
    width: 90px;
}
.ordinacni_doba-tel_cislo {
    font-size: 18px;
    font-weight: bold;
    display: inline-block;
    width: 90px;
}
.ordinacni_doba-dny {
    font-weight: bold;
    width: 60px;
}

/*patička - index*/
.index-footer {
    position: relative;
    left: 0;
    bottom: 0;
    width: 100%;
    //background-color: rgba(119,218,214, 0.8);
    background-color: rgba(141,226,255, 0.8);
    color: rgb(64,64,64);
    text-align: center;
    padding-top: 15px;
    padding-bottom: 10px;
    min-height: 55px;
}
.index-footer a:link {
    color: rgb(120,120,120);
}
.index-footer a:visited {
  color: rgb(120,120,120);
}
.index-footer a:hover {
  color: rgb(0,191,255);
}

/*aktuality*/
.aktuality-nadpis {
    font-size: 24px;
    color: rgb(50,206,255);
    padding-bottom: 20px;
    display: inline-block;
    //padding: 20px 20px 20px 20px; 
}
.aktuality-text {
    font-size: 18px;
    padding-bottom: 15px;
    display: inline-block;
}
.aktuality-datum {
    font-size: 13px;
    color: grey;
}
.aktuality-hr {
    border: 1px solid rgb(141,226,255);
    margin: 20px 0px 50px 0px;
}
