/*
Theme Name: E-manuel
Author: Daniel Padrta
Author URI: https://padrta.cz/
Description:  Theme based on Wordpress+Bootstrap 4 theme for E-manuel.
Version: 1.0
License: GNU General Public License v2 or later
License URI: LICENSE
Tags: blog, custom-menu, featured-images, threaded-comments, translation-ready, right-sidebar, custom-background, e-commerce, theme-options, sticky-post, full-width-template
Template: wp-bootstrap-starter
Text Domain: e-manuel
*/

:root {
  --question-border: 4px;
  --spacing: 20px;
  --content-width: 80ch;
}

a {
  color: #005BBD;
  overflow-wrap: break-word;
}

h2 {
  margin-top: 2rem !important;
  margin-bottom: 1rem !important;
}

h3 {
  margin-top: 2rem !important;
  margin-bottom: 1rem !important;
}

h4 {
  margin-top: 2rem !important;
  margin-bottom: 1rem !important;
}

dt {
  margin-top: 2rem !important;
}

body {
  color: #404041;
  font-family: helvetica;
  font-size: 16px !important;
  line-height: 1.8rem;
  background-color: #eaeef1 !important;
  height: 100vh;
  margin: 0;
}

#mainFooter {
  font-size: 85%;
  margin-top: auto;
  padding-top: 1rem;
  width: 100%;
}

#mainFooter .footer-light {
  background-color: #eaeef1;
}

#mainFooter .footer-dark {
  background-color: #5f7783;
  color: white;
}


#mainFooter a {
  color: inherit;
}

.eman-width {
  max-width: 80ch !important;
}

.eman-gutter {
  min-height: 100%;
  background-color: #b3bec5;
}

.spacer {
  margin-top: 1rem;
}

.eman-page-title {
  color: white;
  font-weight: bold;
}

.site-content {
  background-color: #eaeef1;
}

.hero-image-link {
  text-decoration: none;
  text-align: center;
  color: white;
  transition-property: color;
  transition-duration: 0.33s;
}

.hero-image-link:hover {
  text-decoration: none;
  color: #f58220;
}

/* start galleries and images */

/* gallery headings text */

.eman-image {
  background-color: white;
  box-sizing: border-box;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.eman-image>a {
  display: flex;
  justify-content: center;
}

.eman-image>img {
  max-height: 800px;
}

.eman-image>figcaption {
  text-align: center;
  margin-top: 1rem !important;
}

figcaption {
  font-size: 1em !important;
  line-height: 1.5rem !important;
}

.eman-gallery-title {
  text-align: center;
  margin-bottom: 1rem;
  font-size: 1.5rem;
}

/* adds white borders around images and galleries */

.wp-caption {
  padding: 1.5rem;
  background-color: white;
  min-width: 100%;
  border-top-width: 0;
  border-bottom-width: 0;
}

div[id^="foogallery-gallery-"] {
  padding-top: 1.5rem;
  background-color: white;
  margin-bottom: 1rem !important;
}

/* end borders */

/* end galleries and images */

#content.site-content {
  padding-bottom: 0;
  padding-top: 0;
}

.main-content {
  padding-bottom: 3rem;
}

header#masthead {
  margin-bottom: 0;
  background-color: #0e2631;
  margin: 0;
  align-items: center;
  padding: 0.5rem 0 0.5rem 0;
}

.entry-content {
  margin: 0;
}

.widget {
  margin: 0 0 1.5em;
  font-size: 16px;
  /* Make sure select elements fit in widgets. */
}

#web-logo {}

#web-logo img {
  max-width: 255px;
  max-height: 32px;
}

.tertiary-menu {
  margin-bottom: 2rem;
}

.menu-icon {
  color: #f58220;
  width: 32px;
  height: 32px;
  margin-right: 1rem;
}

/* Menus */

.top-nav-bar {
  background-color: #5f7783;
}

.sub-menu {
  display: flex;
  /* margin to offset padding so the elements are aligned text-wise */
  margin: 0 0 0 -1rem;
  padding: 0;
  list-style-type: none;
  flex-wrap: wrap;
  text-indent: 0 !important;
}

.sub-menu li a {
  font-weight: 700;
  color: white;
  display: block;
}

.dark-blue-bg {
  background-color: #334c58;
}

.dark-blue-bg a:hover {
  background-color: #0e2631;
  color: #f58220;
}

.dark-blue-bg .menu-active a {
  background-color: #5f7783;
}

.medium-blue-bg {
  background-color: #5f7783;
}

.medium-blue-bg a:hover {
  background-color: #334c58;
  color: #f58220;
}

.medium-blue-bg .menu-active a {
  background-color: #eaeef1;
  color: #5f7783;
}

/* disabled for now because when on 3rd-tier page, it doesnt light up
#sticky-menus .active a {
  color: #f58220;
}
*/

/* End menus */

/* Tabs */

.centered-tabs .ui-tabs .kc_tabs_nav {
  display: flex;
  justify-content: center;
}

.centered-tabs .ui-tabs .ui-tabs-body-active {
  display: flex;
  justify-content: center;
}

.hero-image {
  color: white;
}

.text-shadow {
  text-shadow: 0px 0px 4px #000000;
}

.full-width .kc-row-container .kc-wrap-columns div {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.chapter-title {
  text-align: center;
  /* FIXME find out how to make it aligned with the rest of the page content*/
  color: white;
  font-weight: 700;
  padding: 0.5rem 1rem 0.5rem 1rem;
}

/* end tabs */

/* start table */

.eman-table {
  overflow-x: auto;
}

table caption {
  caption-side: top;
}

table th {
  background-color: #344d59;
  color: white;
  white-space: nowrap;
}

table th {
  padding: 0.5rem 1rem 0.5rem 1rem;
  background-color: #344d59;
  color: white;
  white-space: nowrap;
}

table td {
  padding: 0.5rem 1rem 0.5rem 1rem;
}

table tr:nth-child(even) {
  background-color: #edf1f3;
}

table tr:nth-child(odd) {
  background-color: #cbd5db;
}

.emanuel-table .odd td {
  background-color: #b5c2c9 !important;
}

/* end table */

/* start lists */

.eman-long-ol {
  list-style-position: outside;
}

.eman-long-ol li {
  padding-left: 0.5rem;
}

/* end lists */

/* start Geogebra */

.geogebra-wrapper {
  background-color: white;
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
}

.geogebra-wrapper p {
  text-align: center;
  margin: 1rem 1.5rem 0 1.5rem;
}

/* start before-after / twenty20 */

.eman-twenty {
  margin-bottom: 1.5rem;
}

.eman-twenty p {
  margin-bottom: 0;
}

/* end before-after / twenty20 */

/* start exercises */

.question-image {
  border: 1rem solid white;
}

.question-field {
  border: 2px solid #f58220;
  background-color: white;
  text-align: right;
  font-weight: bold;
  box-sizing: border-box;
  padding-right: 10px;
}

.question-submit {
  background-color: #f58220;
  font-weight: bold !important;
  color: white;
  border-radius: 0rem;
}

.question-submit-gray {
  background-color: #a7b1b8;
  ;
}

.border-bottom-orange {
  border-bottom: 3px solid #f58220;
}

.question-control-row {
  padding-bottom: 0.5rem;
}

.question>i.question-submit {
  vertical-align: middle;
}

.multiple-questions {
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.multiple-questions>.question-submit {
  align-self: center;
}

.question-reasoning {
  width: 100%;
  box-sizing: border-box;
  background-color: white;
}

.question-result-shown {
  border-top: 3px solid #f58220;
}

.question-result-message {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.multiple-questions>.eman-possible-answers {}

.question-selection>fieldset>* {
  padding: 0 2rem 0 2rem;
}

.question-selection-input {
  margin-right: 0.3rem;
}

.question-selection>fieldset>legend {
  font-size: inherit;
}

/* end exercises */

/* start practice */

.eman-practice-result {}

/* end practice */

.important-note {
  border-top: 4px solid #F58220;
  border-bottom: 4px solid #F58220;
  background-color: white;
  box-sizing: border-box;
  padding: 2rem;
  margin: 2rem 0 2rem 0;
}

/* SiteOrigin Customizations */

.sow-tabs-tab-container {
  justify-content: center;
}

.sow-accordion-panel-header-container {
  justify-content: center;
  font-weight: bold;
}

/* search form */

form.eman-search {}

/* end search form */

/* start backgrounds */

.bg-yellow {
  background-color: yellow;
}

.bg-greenyellow {
  background-color: greenyellow;
}

/* end backgrounds */

/* start accordion */

.eman-orange-accordion {
  --color-scheme: #f58220;
  margin-bottom: 1.5rem;
}

.eman-gray-accordion {
  --color-scheme: #7c8992;
  margin-bottom: 1.5rem;
}

.eman-accordion-header {
  cursor: pointer;
  background-color: var(--color-scheme);
}

.eman-accordion-question {
  background-color: white;
  border-bottom: 3px solid var(--color-scheme);
  cursor: pointer;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.eman-accordion-arrow {
  cursor: pointer;
  height: 20px;
  width: 38px;
}

.eman-accordion-content {
  padding-left: 1rem;
  padding-right: 1rem;
}

.eman-accordion-panel {
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.eman-accordion-panel-close {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}

.eman-accordion-open-arrow {
  opacity: 1;
  transition: opacity 0.3s;
}

.eman-accordion-hidden {
  opacity: 0;
}

.eman-accordion-active {
  background-color: white;
}

.eman-accordion-icon {
  margin-left: 0.5rem;
}

.eman-accordion-title {
  color: white;
  font-weight: bold;
  margin-left: 1rem;
  padding: 0.2rem 0 0.2rem 0;
}

.eman-accordion-border {
  border-bottom: 3px solid var(--color-scheme);
}

.eman-accordion-slim-header {
  height: 3px;
  background-color: var(--color-scheme);
}

/* end accordion */

/* start exercise */

.eman-exercise-title {
  display: flex;
  align-items: baseline;
}

.eman-exercise-title>h2 {
  margin: 0 !important;
}

.eman-exercise-assignment {
  margin-bottom: 0.5rem;
}

.eman-exercise-title>img {
  margin-left: 1.5rem;
}

/* end exercise */
.eman-hero-text {
  text-align: center;
}

.multi-questions-assignment {
  margin-left: 2rem;
  margin-right: 2rem;
}

.headline-container {
  display: flex;
  justify-content: end;
}

.headline-container .headline {
  margin-right: auto;
}

.headline-container .headline-play-image {
  min-width: 38px;
}

.image-index-header {
  text-align: center;
  padding: 0;
  margin: 3rem 0rem 3rem 0rem;
}