@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&family=Open+Sans:wght@300;400&display=swap');
@charset "UTF-8";
/*
Theme Name: Ordinace polička by fň
Theme URI: ordinacepolicka.cz
Author: Filip Vlach, studio fň
Author URI: http://filipvlach.cz
Description: Dedikovaná šablona pro web Ordinace polička – neměnit, nemazat!
Version: 0.92
License: Nešírit, nekopírovat
License URI: ---
Tags: Šablona Ordinace by fň na míru provedená potřebám prezentace firmy Praktický lékař Polička s.r.o.. Případné úpravy vždy nutně konzultovat a nechat autorizovat (studio fň – Filip Vlach, ja@filipvlach.cz). Šablona není veřejně dostupná a není určena k šíření.
Text Domain: ordinacepolicka_fn

Tailored-fit template for ordinacepolicka.cz
*/

/*******************************************************************************************************************
*
*  Contents:
*  - CSS RESET
*  - BASE
*     - Colors
*  - TEXT STYLES
*     - Links
*     - Headings
*  - LAYOUT
*     - Header
*     - Content
*     - Footer
*     - Mobile
*  - SPECIAL
*     - Menu
*     - Form elements
*     - Company info
*     - Timetable
*  - OTHER
*     - Legacy
*  - MEDIA QUERIES
*
*******************************************************************************************************************/
*,:after,:before{box-sizing:border-box;}html{position:relative;overflow-y:scroll;overflow-x:hidden;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}body,html{height:100%;}html,body,fieldset,figure,for,h1,h2,h3,h4,h5,h6,p{margin:0;}article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}[hidden],audio:not([controls]),hr{display:none;}a:active{background-color:transparent;}abbr[title]{border-bottom:1pxdotted;}em,i{font-style:italic;}mark{background:#ff0;color:#000;}code{font-family:monospace,serif;font-size:1em;}sub{font-size:75%;line-height:0;vertical-align:baseline;bottom:-.25em;}img{border:0;-ms-interpolation-mode:bicubic;max-width:100%;height:auto;}svg:not(:root){overflow:hidden;}embed,iframe,img,object{vertical-align:middle;}fieldset{border:0;padding:0;min-width:0;}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;}button,input{line-height:normal;background:00;border:0;padding:0;}button,input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;}button[disabled],input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{padding:0;box-sizing:border-box;}input[type="search"]{-webkit-appearance:textfield;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;resize:vertical;}th{text-align:left;}address{font-style:normal;}button::-moz-focus-inner{padding:0;border:0;}

/*******************************************************************************************************************
*  BASE
*******************************************************************************************************************/
html, body {
    min-height: 100%;
}

body {
    margin: 0;
    background: url('./background-image_cover.jpg') no-repeat 70% 30%;
    background-size: 180%;
    background-attachment: fixed; 
}

a {
    color: inherit;
}

.title-hidden {
    position: absolute;
    left: -9999px;
    outline: none;
}

.float-left {
		float: left;
}

.float-right {
 		float: right;
}

.upc {
    text-transform: uppercase;
}

.alignleft {
    text-align: left;
}

.alignright {
    text-align: right;
}

.aligncenter {
    text-align: center;
}

/*******************************************************************************************************************
*  BASE > Colors
*******************************************************************************************************************/
:root,:root:after,:root:before {
    --main-bg-color: rgb(73,193,191);
    --text-on-bg: rgb(255, 255, 255);
    --text-on-bg-50: rgba(255, 255, 255, .5);
}

.color-medevio {
    color: #26c296;
}

.background-medevio {
    background: #26c296;
}

/*******************************************************************************************************************
*  TEXT STYLES
*******************************************************************************************************************/
body {
    /*font-family: 'Montserrat', sans-serif;*/
    font-family: 'Open Sans', sans-serif;
    font-size: 16pt;
}

#page-content {
    margin-bottom: 24px;
}

#page-content, #page-content * {
    font-size: 14pt;
}

#page-content h1,
#page-content h2,
#page-content h3,
#page-content h4,
#page-content h5,
#page-content h6 {
    margin: 0 0 12px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
}

#page-content h1 {
    font-size: 22pt;
}

#page-content p {
    margin: 0 0 12px;
}

#page-content ul.dashed {
    margin: 0 0 12px;
    padding: 0 0 0 12px;
    list-style: none;
}

#page-content ul.dashed > li {
    position: relative;
    padding-left: 12px;
}

#page-content ul.dashed > li:before {
    position: absolute;
    left: -12px;
    content: "—";
}

#page-content .date-info {
    margin: 0 6px 0 0;
    font-size: 80%;
    font-style: italic;
    font-weight: normal;
}


/*******************************************************************************************************************
*  LAYOUT
*******************************************************************************************************************/
/*.page-wrap {
    margin: 0 auto;
    max-width: 1400px;
}
*/
#container {
    display: flex;
    padding: 48px 24px;
}

#container .container-col {
    flex: 1;
}

#page-content {
    padding: 24px;
    background: rgba(255,255,255,.4);
}

/*******************************************************************************************************************
*  SPECIAL
*******************************************************************************************************************/
.cursor-help {
    cursor: help;
}
.button-round {
    border-radius: 10px;
    text-decoration: none;    
}
.button-special {
    display: inline-block;
    margin: 15px 25px;
    padding: 15px 25px;
    color: white;
}
/*******************************************************************************************************************
*  SPECIAL > Company-info
*******************************************************************************************************************/
.page-head {
    padding: 48px 48px 0;
}

.page-head .logo {
    display: block;
}

.container-col {
    padding: 0 24px;
}

.company-info {
    background: rgba(255,255,255,0.8);
    padding: 24px;
    font-family: 'Montserrat', sans-serif;
    font-size: 12pt;
    text-align: center;
    margin: 0 0 24px; 
}

.company-info .company-info-row-head {
    display: block;
    width: 100%;
    font-size: 18pt;
    font-weight: 600;
}

.company-info .company-info-head {
    margin: 0 0 12px;
}

.company-info .company-info-row {
    display: flex;
}

.company-info .company-info-row .company-info-col {
    flex: 1;
    flex-basis: 33.33%;
}

.company-info .company-info-row .company-info-col .company-info-row-text {
    font-weight: 600;
    margin: 12px 0 0;
}

.company-info .company-info-row .company-info-col .company-info-row-text .semi-header {
    display: block;
    font-weight: 400;
    font-style: italic;
}


/*******************************************************************************************************************
*  SPECIAL > Timetable
*******************************************************************************************************************/
#timetable {
    color: var(--text-on-bg);
    background-color: var(--main-bg-color);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 18pt; 
    text-transform: uppercase;  
	table-layout: auto; 
}

#timetable .timetable-head {
    font-size: 26pt;
    text-align: center;
    font-weight: 700;
}

#timetable .timetable-row {

}

#timetable .timetable-row .timetable-row-head {
    font-weight: 700;
    width: 26%;
}

#timetable .timetable-row .timetable-row-cell {
    padding: 24px;
    position: relative;
    white-space:nowrap
}

#timetable .timetable-row .timetable-row-cell.timetable-row-cell-pm {
	width: 100%;
    border-left: 3px solid var(--text-on-bg-50);
    padding-left: 34px;
}

#timetable .timetable-row .timetable-row-cell.timetable-row-cell-empty {
    padding-left: 102px;
}

#timetable .timetable-row .timetable-row-upper-cell {
    font-size: 11pt;
    position: absolute;
    top: 4px;
}

#timetable .timetable-row .timetable-row-upper-cell .fa {
    font-size: 10pt;
}

#timetable .timetable-row .timetable-row-bottom-cell {
		font-size: 11pt;
		position: absolute;
		bottom: 2px;
		font-style: italic;
}

#timetable .timetable-row.timetable-row-warning td {
    padding: 0 24px 48px;
}

#timetable .timetable-row.timetable-row-warning div {
    padding: 12px;
    font-size: 18px;
    text-align: center;
    /*color: var(--main-bg-color);
    background-color: var(--text-on-bg);*/
}

#timetable .timetable-row.timetable-row-warning div .smaller {
	margin-top: .6em;
	font-size: 80%;
}


#timetable .timetable-row .timetable-row-cell .timetable-row-contrast-cell {
    position: relative;
    margin: -32px -24px -24px -24px;
    padding: 32px 24px 24px 24px;
    color: var(--main-bg-color);
    background-color: var(--text-on-bg);
}

#timetable .timetable-row .timetable-row-cell .timetable-row-contrast-cell .timetable-row-upper-cell {
    top: 12px;
}

#timetable .timetable-foot {
    font-size: 11pt;
    text-align: center;
}

#timetable .timetable-foot .fa {
    font-size: 12pt;
}

@media (max-width: 1376px) {
#container {
    display: block;
}
}

@media (max-width: 880px) {
.company-info .company-info-row {
    display: block;
}
#timetable .timetable-row .timetable-row-head,
#timetable .timetable-row .timetable-row-cell {
	width: 100%;
	display: block;
}
#timetable .timetable-row .timetable-row-head {
	text-align: center;
}
#timetable .timetable-row .timetable-row-cell.timetable-row-cell-pm {
    padding-left: 24px;
    margin-bottom: 24px;
	border: 0;
}
}

@media screen and (orientation: portrait) {
body {
    background-size: cover;
    background-position: center center;
}
}