@charset "UTF-8";
/*
Theme Name: Shaolin
Author: Linda Zeller
Description: Templates anhand Layouts von Jörg Kremer für die Webseite shaolin.ch
*/


/*INFORMATION

Breakpoints:
Mobile: 600px;
Tablet: 900px;
Desktop: 1200px;

*/

@import url('https://fonts.googleapis.com/css?family=Anton|Bitter|Shadows+Into+Light+Two');

@import url(resets.css);
@import url(fonts.css);
@import url(style_vars.css);
@import url(boxes.css);
@import url(singlepages.css);
@import url(navigation.css);
@import url(footer.css);
/*@import url(newshaolin.css);*/
@import url(gridstructures.css);
@import url(courses.css);
@import url(woocommerce.css);
@import url(slider.css);
@import url(communitymap.css);


#siulam-main-nav .menu-item {
	max-width: initial;
}

body {
	max-width:1800px;
	margin: auto;
	-webkit-box-shadow: 0px 0px 15px 0px rgba(158,158,158,1);
	-moz-box-shadow: 0px 0px 15px 0px rgba(158,158,158,1);
	box-shadow: 0px 0px 15px 0px rgba(158,158,158,1);
}

button {
	-webkit-appearance: none !important;
    -moz-appearance: none !important;
}


#content,
header#siulam-main-header
{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.siulam-contentpart,
.siulam-contentpart-width {
	padding: 0 15px;
	max-width: 1000px;
	box-sizing: border-box;
	width: 100%;
}

/*main {*/
	/*width: 100%;*/
	/*display:flex;*/
	/*align-items:center;*/
	/*flex-direction: column;*/
/*}*/



.siulam-numberblock {
	width: 100%;
	background: var(--darkBackground);
	display:flex;
	flex-direction: column;
	align-items:center;
}

.siulam-numberblock {
    width: 100%;
    background: var(--darkBackground);
    display: flex;
    flex-direction: initial;
    justify-content: center;
    flex-wrap: wrap;
}
.siulam-numberblock h3 {
    width: 100%;
    padding-left: var(--gridGap);
	max-width: 1000px;
    box-sizing: border-box;
}

@media all and (max-width:600px) {
	.siulam-numberblock h3 {
		text-align:center;
	}
}

.siulam-contact-button a {

	display: flex;
	justify-content: center;
	align-items: center;
	height: 40px;
	font-size: 14px;
}

.siulam-contact-button a i {
	font-size: 36px;
	color: var(--yellow);
	transition: 0.3s;
	margin-left: 20px;
}

.siulam-contact-button a i:hover {
	transform: rotate(10deg);
	color: var(--darkGrey);
}

.siulam-contact-button a .siulam_cart_count {
	height: 20px;
	width: 20px;
	background: white;
	border: 3px solid var(--lightGrey);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: -5px;
	right: -10px;
}


#siulam_lessons {
	margin-bottom: var(--gridGap);
}

.siulam-timetable {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-gap: 1px;
}

.siulam-tt-column {
	display:grid;
	grid-template-rows: 30px calc(12 * var(--timetableUnit)) calc(12 * var(--timetableUnit)) calc(12 * var(--timetableUnit)) calc(12 * var(--timetableUnit)) calc(12 * var(--timetableUnit));
	grid-gap: 1px;
	position:relative;
}

.siulam-tt-hourcell {
	height: calc(12 * var(--timetableUnit));
	background: var(--lightGrey);
}

.siulam-tt-fiveminute.siulam-tt-set {
	background: var(--yellow);
}

.siulam-tt-lesson span {
	font-size: 10px;
	text-align:center;
}

.siulam-tt-lessontitle {
	font-weight:700;
}

.siulam-tt-lesson {
	width: 100%;
	position: absolute;
	display: flex;
	align-items:center;
	justify-content:center;
	flex-direction: column;
	background: var(--yellow);
	padding-top: var(--timetableUnit);
}

.siulam-children {
	height: calc(11 * var(--timetableUnit));
}

.siulam-adult,
.siulam-advanced,
.siulam-blackbelt{
	height: calc(18 * var(--timetableUnit));
}

.siulam-lessonend-1615 {
	bottom: calc(70 * var(--timetableUnit));
}

.siulam-lessonend-1745 {
	bottom: calc(52 * var(--timetableUnit));
}


.siulam-lessonend-1755 {
	bottom: calc(50 * var(--timetableUnit));
}

.siulam-lessonend-1800 {
	bottom: calc(49 * var(--timetableUnit));
}

.siulam-lessonend-1825 {
    bottom: calc(44 * var(--timetableUnit));
}

.siulam-lessonend-1830 {
	bottom: calc(42 * var(--timetableUnit));
}

.siulam-lessonend-1840 {
	bottom: calc(23 * var(--timetableUnit));
}

.siulam-lessonend-1845 {
	bottom: calc(24 * var(--timetableUnit));
}

.siulam-lessonend-1900 {
	bottom: calc(37 * var(--timetableUnit));
}

.siulam-lessonend-1910 {
	bottom: calc(35 * var(--timetableUnit));
}


.siulam-lessonend-1915 {
	bottom: calc(34 * var(--timetableUnit));
}

.siulam-lessonend-1920 {
	bottom: calc(31 * var(--timetableUnit));
}

.siulam-lessonend-1925 {
	bottom: calc(32 * var(--timetableUnit));
}

.siulam-lessonend-1930 {
	bottom: calc(31 * var(--timetableUnit));
}

.siulam-lessonend-1945 {
	bottom: calc(28 * var(--timetableUnit));
}

.siulam-lessonend-2000 {
	bottom: calc(24 * var(--timetableUnit));
}

.siulam-lessonend-2010 {
	bottom: calc(22 * var(--timetableUnit));
}

.siulam-lessonend-2115 {
	bottom: calc(9 * var(--timetableUnit));
}

.siulam-lessonend-2130 {
	bottom: calc(6 * var(--timetableUnit));
}

.siulam-lessonend-2150 {
	bottom: calc(4 * var(--timetableUnit));
}

.siulam-lessonend-2145 {
	bottom: calc(3 * var(--timetableUnit));
}

.siulam-tabcontrol a {
	bottom: 10px;
	height: 50px;
	background: var(--lightGrey);
	font-family: var(--titleFontFamily);
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--darkGrey);
	display: flex;
	justify-content: center;
	align-items: center;
}

.siulam-tabcontrol .ui-state-active a {
	background: var(--yellow);
}

.siulam-tabcontrol {
	list-style: none;
	padding-left:0;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-gap: 1px;
}

.siulam-tabcontrol li {
	display: inline;
}

#siulam-single-school .siulam-event * {
	color: var(--lightGrey);
}

#siulam-single-school .siulam-single-event {
	margin-top: 30px;
	margin-bottom: 50px;
}





#ddcom_lightbox {
    position: fixed;
    left: 0;
    height: 100%;
    width: 100%;
    top: 0;
    background: rgba(0,0, 0,0.4);
    display: none;
    justify-content: center;
    align-items: center;
}

#ddcom_lightbox_content {
    margin: 30px;
    background-color: white;
    padding: 20px;
    box-sizing: border-box;
    display: grid;
    grid-template-rows: auto 40px;
    grid-gap: 20px;
    position: relative;
}

.ddcom_lightboxhandler {
    height: 40px;
    width: 40px;
    background: white;
    display: flex;
    justify-content: center;
    align-items:center;
    position: absolute;
    cursor: pointer;
}

nav#ddcom_close_lightbox {
    right: 30px;
    top: 30px;
}

nav#ddcom_close_lightbox i {
    width: 80%;
    height: 1px;
    background: black;
    transform: rotate(45deg);
    transform-origin: 50% 50%;
    position: absolute;
}

nav#ddcom_close_lightbox i:last-of-type {
    transform: rotate(-45deg);
}

nav#ddcom_left_right {
    width: 100%;
    height: 40px;
    position: absolute;
    top: calc(50% - 40px);
}

nav#ddcom_left_right > div {
    flex-direction: column;
    cursor: pointer;
}

nav #ddcom_arrow_left {
    left: 30px;
}

nav #ddcom_arrow_right {
    right: 30px;
}

nav#ddcom_left_right i {
    height: 1px;
    background: black;
    display: block;
    width: 15px;
    margin: -0.5px auto;
}

nav #ddcom_arrow_left i:first-of-type,
nav #ddcom_arrow_right i:last-of-type{
    transform: rotate(-45deg);
}

nav #ddcom_arrow_right i:first-of-type,
nav #ddcom_arrow_left i:last-of-type{
    transform: rotate(45deg);
}

nav #ddcom_arrow_left i {
    transform-origin: left;
}

nav #ddcom_arrow_right i {
    transform-origin: right;
}

.ddc_gallery_basic .ddc_imagecontainer {
    height: 200px;
}

.ddc_gallery_row.ddc_gallery_basic {
    height: auto;
}

#ddcom_lightbox_content img {
	max-width: 800px;
	max-height: 600px;
	width: auto;
	height: auto;
}

.wp-block-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: auto;
    grid-gap: 10px;
}

.wp-block-gallery img {
	cursor: pointer;
}

.wp-block-gallery.columns-3 .blocks-gallery-image, .wp-block-gallery.columns-3 .blocks-gallery-item {
    width: 100%;
    margin-right: 0;
}

.wp-block-gallery .blocks-gallery-image figure, .wp-block-gallery .blocks-gallery-item figure {
    display: block !important;
}

.siulam-team-withoutpic figure {
	display:none;
}



/*Experimentell*/

#content .uagb-ifb-desc {
	text-align:left;
}