/*
 Theme Name:   Calm Studio
 Description:  Calm Studio Theme
 Author:       Matt Cruse
 Author URI:   https://mattcruse.dev
 Template:     generatepress
 Version:      0.0.1
*/

/* HEADER */
@media (max-width: 768px) {
	.inside-header {
		flex-direction: row;
	}
}

/* HOMEPAGE VIDEO BG */

.background-video {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 1;
	  z-index: 0;
}

video[poster] {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/* SVG FILLS */

.fill--white svg {
	fill: var(--base-3);
	transition: fill .35s;
}

.fill--white:hover svg {
	fill: var(--base-2);
}

/* CONTACT FORM 7 STYLES */

.wpcf7-form-control-wrap input[type=text],
.wpcf7-form-control-wrap input[type=email],
.wpcf7-form-control-wrap textarea {
	width: 100%;
	background-color: var(--base-3);
}

/*
.momoyoga-schedule (styles that involve the entire class schedule display)
.momoyoga-section (styles that include the area per day)
.momoyoga-day (the style of the name of the day)
.momoyoga-date (the style of the display of the date)
.momoyoga-lesson-title (the style of displaying the class title)
.momoyoga-lesson-time (the style of displaying the start time of the class)
.momoyoga-lesson-action (the style of the 'Book now' button)
.momoyoga-lesson (styles that involve the plane per lesson content)
.momoyoga-lesson-details (styles that involve the drop down area per lesson)
.momoyoga-lesson-teacher (the style of displaying the teacher name)
.momoyoga-lesson-description (the style of the description of the lesson)
.momoyoga-lesson-link (the style of any link to the lesson)
*/

.momoyoga-schedule {
	display: grid;
/* 	grid-template-columns: repeat(3,1fr); */
	column-gap: 1rem;	
}

.momoyoga-schedule .momoyoga-section {
	display: grid!important;
	grid-template-columns: 50% 50% auto;
    grid-template-rows: 40px auto;
	padding: 0!important;
	overflow: hidden;
	background-color: var(--base-3)!important;
	border-color: var(--natural-base-2)!important;
	color: var(--contrast);
}

.momoyoga-schedule .momoyoga-section .momoyoga-day,
.momoyoga-schedule .momoyoga-section .momoyoga-date {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 20px 10px;
	background-color: var(--contrast-2);
	color: var(--natural-base-3);
	font-family: "Marcellus", serif;
}

.momoyoga-schedule .momoyoga-section .momoyoga-date {
	display: flex;
	justify-content: flex-end;
}

.momoyoga-schedule .momoyoga-section .momoyoga-lesson-action-booknow {
	display: inline-flex;
    align-items: center;
    justify-content: center;
    column-gap: 0.5em;
    width: 100%;
    max-width: 150px;
    text-align: center;
    padding: 10px 20px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    background-color: var(--natural-accent-2);
    color: var(--contrast);
    text-decoration: none;
}

.momoyoga-schedule .momoyoga-section .momoyoga-lesson-action-booknow:hover {
	background-color: var(--contrast-2);
    color: var(--natural-base);
}

.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.momoyoga-schedule .momoyoga-section .momoyoga-lessons {
	grid-column: span 2;
	padding: 0 10px 15px;
}

.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-time,
.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-title,
.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-teacher,
.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-action {	
	position: relative!important;
	top: unset!important;
	right: unset!important;
	bottom: unset!important;
	left: unset!important;
	margin: 0!important;
}	

.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-time,
.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-title > a {
	font-size: 16px!important;	
}

.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-title > a {
	display: block;
	margin-right: 0!important;
	text-transform: lowercase;
}

.momoyoga-schedule .momoyoga-lesson>.momoyoga-lesson-line .momoyoga-lesson-title > a:first-letter {
	text-transform: uppercase;
}

@media only screen and (min-width:600px){
	.momoyoga-schedule {
		grid-template-columns: repeat(2,1fr);
	}
}

@media only screen and (min-width:1280px){
	.momoyoga-schedule {
		grid-template-columns: repeat(3,1fr);
	}
}
