/** * Theme: Online-Terminvergabe by 78media * * Bootstrap breakpoints * --------------------- * sm = 576+ px * md = 768+ px * lg = 992+ px * xl = 1200+ px * * colors * ------ * * @white = #fff rgba(255,255,255, 1) * @dark = #353535 rgba(53,53,53) * @green = #ffd200 rgba(255,210,0) * **/ /* define colors */ @font-color: #222; @white: rgba(255,255,255, 1); @light: #f0f0f0; @grey: #ddd; @dark: rgba(53,53,53, 1); @green: rgba(255,210,0, 1); @dkgreen: rgba(255,222,0, 1); @red: #c00; @dkred: #900; .white { color: @white; } .red { color: @red; } .bg-default { background-color: @white; color: @font-color; } .bg-light { background-color: @light !important; } .bg-grey { background-color: @grey; } .bg-dark { background-color: @dark !important; color: @white; } .bg-green { background-color: @green; color: @white; } .bg-dkgreen { background-color: @dkgreen; color: @white; } .bg-transparent { background-color: rgba(0,0,0, .5) !important; } /* fonts */ @font-face { font-family: "Open Sans"; font-weight: 300; font-style: normal; src: url('../fonts/Open_Sans/OpenSans-Light.ttf') format('truetype'); } @font-face { font-family: "Open Sans"; font-weight: 400; font-style: normal; src: url('../fonts/Open_Sans/OpenSans-Regular.ttf') format('truetype'); } @font-face { font-family: "Open Sans"; font-weight: 600; font-style: normal; src: url('../fonts/Open_Sans/OpenSans-Bold.ttf') format('truetype'); } @font-face { font-family: "Open Sans Condensed"; font-weight: 500; font-style: normal; src: url('../fonts/Open_Sans_Condensed/OpenSansCondensed-Bold.ttf') format('truetype'); } @font-face { font-family: 'LigatureSymbols'; src: url('../fonts/LigatureSymbols/LigatureSymbols-2.11.eot'); src: url('../fonts/LigatureSymbols/LigatureSymbols-2.11.eot?#iefix') format('embedded-opentype'), url('../fonts/LigatureSymbols/LigatureSymbols-2.11.woff') format('woff'), url('../fonts/LigatureSymbols/LigatureSymbols-2.11.ttf') format('truetype'), url('../fonts/LigatureSymbols/LigatureSymbols-2.11.svg#LigatureSymbols') format('svg'); src: url('../fonts/LigatureSymbols/LigatureSymbols-2.11.ttf') format('truetype'); font-weight: normal; font-style: normal; } .lsf, .lsf-icon:before { font-family: 'LigatureSymbols'; -webkit-text-rendering: optimizeLegibility; -moz-text-rendering: optimizeLegibility; -ms-text-rendering: optimizeLegibility; -o-text-rendering: optimizeLegibility; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; } .lsf, .lsf-icon:before { content: attr(title); margin-right: 0.3em; font-size: 130%; } .lsf-icon.favorite:before { content: '\E121'; } /* defaults */ .clearfix { overflow: auto; } html, body { width: 100%; height: 100%; background-color: @white; } body { font-family: "Open Sans", Helvetica, Sans-serif; font-weight: 400; font-size: 18px; color: @font-color; } body { position: relative; background: transparent; /* make bg transparent for bg-image */ padding-bottom: 100px; /* spacing fixed footer bar */ } b, bold { font-weight: 600 !important; } .headline-condensed { font-family: "Open Sans Condensed"; font-weight: bold; } h1 { font-size: 2.25rem; } h1 span { font-size: 0.8em !important; } /* lists */ ul {} .main-content ul li { margin-bottom: .65rem; } /* links */ a, a:link, a:visited { color: @font-color; text-decoration: none; transition: all linear .3s; } a:hover, a:active { color: @green; text-decoration: none; transition: all linear .3s; } .btn-default, .btn-default:link, .btn-default:visited { background: @green; color: @font-color; } .btn-default:hover, .btn-default:active { background: @dkgreen; color: @white; } .btn-red, .btn-red:link, .btn-red:visited { background: @red; color: @white; } .btn-red:hover, .btn-red:active { background: @dkred; color: @white; } /* img */ img { max-width: 100%; /* no over-sizing */ } .box-shadow { box-shadow: 0 2px 4px rgba(0,0,0,.3); } .navbar-header { padding-top: 15px; padding-bottom: 15px; } /* boostrap grid mods */ @media (min-width:1600px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1340px; } } /* navbar-brand */ .navbar-brand {} .navbar-brand .brand-logo { display: block; font-size: 1rem; } .navbar-brand .brand-slogen { display: block; font-size: .25rem; color: @light; } /* navbar */ .navbar-toggler {} .navbar-toggler .toggler-icon { width: 50px; height: auto; } .navbar-toggler .lsf { margin-right: 0; font-size: 2em; } .dropdown-menu { background-color: @dkgreen; border: none; } .dropdown-menu .active, .dropdown-menu .active .dropdown -item { background: @green !important; } @media (min-width:1200px) { .navbar-brand .brand-logo { font-size: 1.5rem; } .navbar-brand .brand-slogen { font-size: .25rem; } .dropdown-menu { box-shadow: 0 4px 4px rgba(0,0,0,.3); } } .dropdown-item { padding: .5rem 1.5rem; } .dropdown-item, .dropdown-item:link, .dropdown-item:visited { background: @dkgreen; color: @font-color; } .dropdown-item:focus, .dropdown-item:hover { background: @green; color: @font-color; } .nav-item > .nav-link, .nav-item > .nav-link:link, .nav-item > .nav-link:visited { padding-left: 15px; padding-right: 15px; color: @font-color; } .nav-item > .nav-link:hover, .nav-item > .nav-link:active { color: @green; } .nav-item > .nav-link.active { background: @green; color: @font-color; } /* breadcrumbs */ .navbar-breadcrumbs { background-color: @light !important; color: @font-color; } .breadcrumbs { padding: .5rem .5rem; font-size: .8rem; background-color: transparent; color: @font-color !important; } @media (min-width:1200px) { .breadcrumbs { padding:.5rem 0; } } /* main content wrapper*/ .content-wrapper {} /* sections */ section, .home-section, .content-section { padding: 60px 0; } /* appointments */ .appointments-list { position: relative; width: 90%; } .appointments { padding: 22px 0; } .appointments .appointment-data-wrapper { position: relative; display: inline-block; font-size: .8em; background-color: #fff; border: solid 1px #999; margin-right: .5rem; margin-bottom: .5rem; } .appointments .entry-type { border-left: solid 5px #999; } .appointments .entry-type-appointment { border-left: solid 5px @green; } .appointments .appointment-data-wrapper .appointment-data { padding: 10px 10px; } .appointments .appointment-data-wrapper .delete-data-set { background: @dkgreen; color: @white; font-size: .8em; display: inline-block; padding: 4px 10px; bottom: 0; right: 0; float: right; } @media (min-width:1200px) { .appointments .appointments-list { width: 96%; } .appointments .appointment-data-wrapper { width: 31%; min-width: 20%; max-width: 31%; } } /* appointsments toolbar */ .appointments-toolbar { background: #ddd; padding: .75rem 1rem; border-radius: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; } .appointments-toolbar label { font-weight: normal; font-size: 1.15rem; margin-right: 10px; display: inline-block; } .appointments-toolbar .datepicker { border: solid 1px #666; padding: .5rem .75rem; width: 100%; display: inline-block; } .appointments-toolbar .appointments-switch-day { display: inline-block; padding: 0 15px; font-size: 1.35em; background-color: @grey; } .appointments-toolbar .appointments-switch-day.appmt-prev { padding: 0 15px 0 5px; } .appointments-toolbar .appointments-switch-day.appmt-next { padding: 0 5px 0 15px; } /* appointments patient notification */ .notification-dialog { padding: 5px 15px; margin-bottom: 15px; background: @light; display: none; } .notification-selected { background-color: #edfeeb !important; } /* appointments modals */ #appointment-auto-next { display: none; padding: .5rem; margin-bottom: .75em; background: @light; } /* appointments fullview */ .appointments-fullview { font-size: .9em; padding: 0 15px; } /* +++ overriding bootstrap grid +++ */ .appointments-fullview .col-lg-1 { padding-left: 5px !important; padding-right: 5px !important; } .appointments-fullview .month, .appointments-fullview .month-border { border-left: solid 1px @white; border-right: solid 1px @white; } .appointments-fullview .month-day { transition: all linear .3s; border: solid 1px transparent; } .appointments-fullview .month-day:hover { background: linear-gradient(45deg, #fff, #ddd); border: solid 1px @green; } .month-day-highlighted, .month-day-highlighted:hover { background: #fedfdf !important; border: solid 2px @red !important; } .appointments-fullview .col-day-number, .appointments-fullview .col-day-data { padding: 5px 5px; font-size: .8em; } .appointments-fullview .col-day-number .day-name, .appointments-fullview .col-day-number .day-number { display: block; } .appointments-fullview .entry-type { display: block; padding-left: .5rem; border-width: 20px; cursor: pointer; } .appointments-fullview .entry-type-default { border-left: solid 5px @dark; } /* content boxes */ .box { padding: 30px 15px; } @media (min-width:1200px) { .box { padding: 30px 30px; } } /* footer */ footer { width: 100%; background: @dark; color: @white !important; padding: 1em 15px; font-size: .85em; line-height: 1.5em; letter-spacing: 1px; text-transform: uppercase; } footer a, footer a:link, footer a:active, footer a:visited { color: @white; } footer a:hover { color: @white; } footer .footer-copyright * { display: inline !important; width: auto; padding: 0; margin: 0; } /* Cookie consent policy */ .cookie-consent-layer { background: rgba(0,0,0,.8); position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 99995; display: none; } .cookie-consent { position: fixed; background: #fff; padding: 30px; width: 100%; margin: 0 0; top: 0; right: 0; bottom: 0; left: 0; } .cookie-consent .cp-options .cookie-consent-btn { margin-bottom: 1em; } .cookie-consent .cookie-consent-btn { background: @green; color: @font-color; cursor: pointer; } .cookie-consent .cp-info { margin-bottom: 1.5em; } .cookie-consent .cp-settings { display: none; min-height: 400px; height: 400px; overflow-y: auto; overflow-x: hidden !important; } .cookie-consent .settings-option { margin-bottom: 1.5em; } .cookie-consent .cp-setting-header { border-bottom: solid 1px #6d6d6d; padding-bottom: 6px; margin-bottom: 6px; } .cookie-consent .cp-footer { margin-top: 2em; font-size: .85em; } @media (max-width:576px) { .cookie-consent .cp-settings { overflow-y: auto; } .cookie-consent .settings-option { font-size: .8em; } } @media (min-width:992px) { .cookie-consent { border-radius: 5px; width: 60%; height: auto; margin: 5% 20%; left: auto; right: auto; bottom: 0; } } @media (min-width:1200px) { .cookie-consent { width: 40%; height: auto; margin: 10% 30%; } .cookie-consent .cp-options .cookie-consent-btn { margin-bottom: auto; } }