Workshops, Trainings & Classes
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;700&display=swap');
:root {
--border-color: #0000001a;
--signup-button-font-color: #3d3d3d;
--font-family: 'Roboto', sans-serif;
--selected-day-highlight: #3d3d3d11;
--line-item-bkg-color: #3d3d3d11;
--signup-button-bkg-color: #fff;
--button-border-radius: 3px;
}
#ribbon-schedule {
max-width: 960px;
font-family: var(--font-family);
}
#ribbon_schedule > h1 {
font-weight: 300;
margin: 0px;
}
#week_container {
display: flex;
align-items: center;
justify-content: center;
}
.week_day {
flex: 1;
padding: 20px;
margin: -1px;
font-weight: 700;
}
.in_past {
opacity: 40%;
font-weight: 300;
}
.week_day > * {
pointer-events: none;
text-align: center;
}
.day_of_week {
font-size: 12px;
font-weight: 300;
}
.short_date {
font-size: 18px;
font-weight: 500;
}
.prevButton, .nextButton {
display: inline-block;
position: relative;
padding: 18px;
}
button {
padding: 9px 15px;
background-color: #faa014;
color: #fff;
border: none;
border-radius: var(--button-border-radius);
}
.selected_day {
opacity: 100%;
border-radius: var(--button-border-radius);
background-color: var(--selected-day-highlight);
}
.today_container {
display: flex;
justify-content: flex-start;
align-items: center;
margin: 20px 0px;
padding: 10px 18px;
border: 1px solid var(--border-color);
border-radius: var(--button-border-radius);
}
.today_container > button {
margin-left: auto;
}
.schedule_item {
display: flex;
justify-content: flex-start;
align-items: center;
background-color: var(--line-item-bkg-color);
padding: 40px 18px;
}
.event_list_container > ul > :first-child {
border-top-right-radius: var(--button-border-radius);
border-top-left-radius: var(--button-border-radius);
}
.event_list_container > ul > li {
border-bottom: 2px solid #fff;
}
.event_list_container > ul {
padding-left: 0px;
margin: 0px;
}
.event_list_container > ul > :last-child {
border-bottom: 0px;
border-bottom-left-radius: var(--button-border-radius);
border-bottom-right-radius: var(--button-border-radius);
}
.no_events {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.schedule_item > .event_title {
font-weight: 700;
margin: 0px auto 0px 40px;
}
.class_time {
font-weight: 700;
}
.schedule_item > :nth-child(2){
margin: 0px 40px;
width: 140px;
text-align: left;
}
.mobile_loc {
display: none;
}
.teacher_name {
word-wrap: normal;
font-weight: 400;
}
.class_location {
display: flex;
align-items: center;
justify-content: flex-start;
}
.class_location > img {
margin-right: 4px;
}
.livestream_label {
font-size: 14px;
font-weight: 300;
}
.teacher_img {
height: 60px;
width: 60px;
border-radius: 50%;
}
.sign_up_button {
font-size: 14px;
text-transform: uppercase;
padding: 9px 40px;
background-color: var(--signup-button-bkg-color);
border: 1px solid var(--border-color);
color: var(--signup-button-font-color);
text-decoration: none;
border-radius: var(--button-border-radius);
}
.filter_container {
display: flex;
align-items: center;
justify-content: flex-end;
padding: 0px 18px 18px 18px;
}
.filter_container > :nth-child(odd) {
margin-left: 18px;
}
.filter_container > :nth-child(even) {
margin-left: 18px;
}
.list_filter {
padding: 9px 15px;
width: 140px;
border-radius: var(--button-border-radius);
}
.list_filter:focus {
outline: none;
}
.disabled_sign_up {
opacity: 55%;
cursor: no-drop;
}
.livestream_inperson {
display: none;
padding: none;
margin: none;
}
@media screen and (min-width: 769px){
.mobile_loc {
display: none;
}
}
@media screen and (max-width: 768px) {
#ribbon-schedule {
max-width: 768px;
width: 100%;
}
.week_day {
padding: 10px;
}
.desktop_loc {
display: none;
}
.teacher_img {
margin-left: 40px;
}
}
@media screen and (max-width: 675px) {
#ribbon-schedule {
max-width: 675px;
}
.schedule_item > :nth-child(2){
margin: 0px 10px;
}
.desktop_loc {
display: none;
}
.teacher_img {
margin-left: 20px;
}
}
@media screen and (max-width: 560px) {
.schedule_item {
display: block;
padding: 20px 18px 20px 18px;
}
.schedule_item > .event_title {
text-align: center;
margin-left: 0px;
margin-right: 0px;
}
.time_dur {
text-align: center;
}
.class_location {
margin: 10px 0px 10px 0px;
}
.schedule_item > * {
margin: 20px auto 20px auto;
}
.sign_up_button_container {
margin-top: 0px;
width: 100%;
display: flex;
}
.sign_up_button {
margin-top: 30px;
text-align: center;
display:inline-block;
flex: 1;
}
.disabled_sign_up {
margin-top: 30px;
text-align: center;
display:inline-block;
flex: 1;
}
}
@media screen and (max-width: 400px) {
#ribbon-schedule {
max-width: 400px;
}
#week_container {
flex-wrap: wrap;
}
#week_container > .prevButton {
flex: 1;
min-width: 100%;
}
#week_container > .nextButton {
flex: 1;
min-width: 100%;
}
#week_container > .prevButton > button {
flex: 1;
width: 100%;
}
#week_container > .nextButton > button {
flex: 1;
width: 100%;
}
.filter_container {
justify-content: center;
padding: 5px 18px 20px 18px;
}
}
Testimonial
[random_testimonial theme="default_style" count="1" show_title="0" use_excerpt="0" show_thumbs="0" show_date="0" show_other="0" hide_view_more="0" output_schema_markup="1"]
Main Links
Useful
Contact
Cindy Beers
717-571-4610
cindy@cindybeers.com
© Cindy Beers | All Rights Reserved | Website design: Mindburn Solutions