/**
Theme Name: Tanzschule Krebs
Author: Benjamin Cappell
Author URI: http://wpastra.com/about/
Description: Tanzschule Krebs is based on Astra. Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tanzschule-krebs
Template: astra
*/

/* This makes the footer stick to the bottom of the page even if there is less content than the full viewport height. */
#page {
    display: flex;
    flex-direction: column;
	min-height: 100vh;
}
.admin-bar #page{
	min-height: calc(100vh - 32px);
}
#page .site-content{
    flex-grow: 1;
}

/* Footer selection color */
.site-footer *::selection {
  background-color: var(--ast-global-color-2) !important;  /* Set the background color when text is selected to dark blue as the background of the footer is red */
}

/* Kurs header BG on eye level */
.ast-single-entry-banner[data-post-type="kurs"][data-banner-background-type="featured"] {
	background-position: center 20%
}

/* Tanzschulseiten header BG on eye level */
.ast-single-entry-banner[data-post-type="tanzschulseite"][data-banner-background-type="featured"] {
	background-position: center 35%
}

/* mobile menu arrow down fix */
.ast-menu-toggle {
	height: 54px;
}

/* fix images in post display to fill the whole top also on tablet & mobile */
.wp-block-uagb-post-grid.uagb-post__image-position-top .uagb-post__inner-wrap .uagb-post__image {
	margin-left: -20px !important;
	margin-right: -20px !important;
	margin-top: -20px !important;
} 

/* not so much distance to the button in top image post display */
.wp-block-uagb-post-grid.is-grid.uagb-equal_height_inline-read-more-buttons.uagb-post__image-position-top .uagb-post__text:nth-last-child(2) {
	padding-bottom: 70px !important;
}

/* MORE distance to the button in bg image post display */
.wp-block-uagb-post-grid.is-grid.uagb-equal_height_inline-read-more-buttons.uagb-post__image-position-background .uagb-post__text.uagb-post__excerpt {
	padding-bottom: 200px;
}

/* more distance for icon list labels */
/* also possible in frontend
.uagb-icon-list__label {
	line-height: var(--ast-body-line-height, 1.7em) !important;
}

*/

/* post grid images should always cover, not stretch  */
.uagb-post-grid .uagb-post__image img {
    object-fit: cover;
	  width: 100%;
  	height: 100%;
  	max-width: 100%;
  	max-height: 100%;
}

/* settings for post carousel and grid */ 
.wp-block-uagb-post-carousel .uagb-post__image img {
	aspect-ratio: 3 / 2
}

.uagb-post__image img {
	object-position: 50% 35%;
}

.wp-block-uagb-post-carousel .uagb-post__inner-wrap {
	position: relative;
}
.wp-block-uagb-post-carousel .uagb-post__cta {
	position: absolute;
	left: 0%;
	right: 0%;
	bottom: 0px;
}

.uagb-post__title, .uagb-post__excerpt, h1.entry-title {
	word-break: break-word;
	hyphens: auto; 
}


/* remove navigation from tanzschulseite */
.tanzschulseite ~ .post-navigation {
	display: none;
}

/* remove navigation from specific kurse */
.kurskategorie-kurskategorien ~ .post-navigation {
	display: none;
}

/* table striped style background colors */
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
	background-color: var(--ast-global-color-5);
}
.wp-block-table.is-style-stripes tbody tr:nth-child(even) {
		position: relative;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(even) ::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--ast-global-color-5);
    opacity: 0.15;
    z-index: -1;
}

/* party edits */
@media (max-width: 768px) {
  .partytermine table {
    font-size: 13px;
	line-height: 1.1em;
  }
}

/* Kursanmeldung form edits */
.kurstermine {
	color: var(--ast-global-color-7);
}

.kurstermine table td {
	padding-left: 5px;
	padding-right: 5px;
}

.kurstermine table td:not(:first-child) {
	text-align: center;
}

@media (max-width: 768px) {
  .kurstermine table {
    font-size: 12.5px;
	line-height: 1.1em;
	letter-spacing: -0.05em; 
  }
}

@media (max-width: 480px) {
	.kurstermine table {
    	font-size: 12px;
		line-height: 1.1em;
		letter-spacing: -0.05em; 
	 }
	.kurstermine table td {
		padding-left: 3px;
		padding-right: 3px;
	}
}
.kurstermine form input[type=text], 
.kurstermine form select {
	padding: 2px;
	max-width: calc(20ch);
	width: 100%; 
  	box-sizing: border-box;
}
.kurstermine td.very_small {
	text-align: left !important;
}

.kurstermine table {
		margin: 0 0 0 0;
}

/* Red background of an element, which goes over full viewport width */
.krebs-bg-fw::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%; /* Center from the left */
    transform: translateX(-50%); /* Adjust to the center */
    width: 100vw; /* Full viewport width */
    height: 100%; /* Full height of the parent */
    background-color: var(--ast-global-color-0);
    z-index: -1; /* Place it behind content */
}

/* Woocommerce quickfixes with germanized */
#order_review_heading.wc-gzd-heading-moved {
    float: left !important;
    width: auto !important;
    border: none !important;
    padding-left: 0 !important;
}

/* krebs-kurskalender-kurse: mobile button to next row */
@media (max-width: 768px) {
	.kurstermine .krebs-kurskalender-kurse table {
		border: none;
	}
	.kurstermine .krebs-kurskalender-kurse thead tr td, 
	.kurstermine .krebs-kurskalender-kurse tbody tr td{
		flex: 1;
    }
	.kurstermine .krebs-kurskalender-kurse thead tr, 
	.kurstermine .krebs-kurskalender-kurse tbody tr {
		display: flex;
		width: 100%;
    	flex-wrap: wrap;
  	}
	
	.kurstermine .krebs-kurskalender-kurse thead tr td:last-child {
		display: none;
	}

 	.kurstermine .krebs-kurskalender-kurse tbody td:last-child {
		flex-basis: 100%;
		margin-top: 5px;
		margin-bottom: 20px;
    }
}

/* Kurse buchen link display as button */
.kurstermine .krebs-kurskalender-kurse tbody td:last-child a,
.kurstermine .kk_terminliste tbody td:last-child a {
	background-color: var(--ast-global-color-0);	
	color: #FFF;
	padding: 5px 20px;
	border-radius: 30px;
	letter-spacing: 0; 
}

.kurstermine .krebs-kurskalender-kurse tbody td:last-child a:hover,
.kurstermine .kk_terminliste tbody td:last-child a:hover {
	background-color: var(--ast-global-color-1);	
	color: #FFF;
}

/* red border around kurstermine */
.kurstermine {
	border: 3px solid var(--ast-global-color-0) !important;
    z-index: -2;
	border-radius: 15px;
}