/* CSS Document */

/**************** Colour Scheme *****************/
/* background: #000033; /* dark blue background colour - same colour as rgb = (0, 0, 51) */
/* color: #9999CC;      /* light blue colour - same colour as rgb = (153, 153, 204) */
/* color: #CC9966;      /* light orange colour - same colour as rgb = (204, 153, 102) */
/* color: #99FF33;      /* light green colour - same colour as rgb = (153, 255, 51) */
/**************** Email for sending issues *****************/
.classes p #email{
    text-decoration: none;
}
.classes p #email:link {
    color: #9999CC;
}
.classes p #email:hover {
    color: #99FF33;
}
/***********************************************************/

.section {
  padding: 30px 0;
  color: #999966;
}
.section .top-side {
  text-align: center;
}
.section .top-side .title {
  font-weight: 500;
  font-size: 15px;
  display: inline-block;
}
.section .top-side .title::after {
  content: "";
  display: block;
  width: 50%;
  border-bottom: 1px solid #cc9966; /* #494949; very dark gray */
  margin: 8px auto;
}

/* Courses Gallery Heading */
.section .top-side h2 {
  color: #cc9966;
  font-weight: 700;
}
.section.courses .filters {
  text-align: center;
  margin-top: 20px;
}
.section.courses .filters ul {
  padding: 0;
}
.section.courses .filters ul li {
  list-style: none;
  display: inline-block;
  padding: 20px 30px;
  cursor: pointer;
  position: relative;
}
.section.courses .filters ul li::after {
  content: "";
  display: block;
  width: calc(0% - 60px);
  position: absolute;
  height: 2px;
  background: #99ff33; /* lime green */
  transition: width 350ms ease-out;
}
.section.courses .filters ul li:hover::after {
  width: calc(100% - 60px);
  transition: width 350ms ease-out;
}
.section.courses .filters .active::after {
  width: calc(100% - 60px);
}
.section.courses .filters-content {
  margin-top: 50px;
}
.section.courses .filters-content .show {
  opacity: 1;
  visibility: visible;
  transition: all 350ms;
}
.section.courses .filters-content .hide {
  opacity: 0;
  visibility: hidden;
  transition: all 350ms;
}
.section.courses .filters-content .item {
  text-align: center;
  cursor: pointer;
  margin-bottom: 30px;
}
.section.courses .filters-content .item .p-inner {
  text-align: left;
  padding: 20px 29px 6px 30px;
  box-shadow: 0 0 5px rgba(204, 153, 102, .8); /* light orange box shadow */
}
/* reposition course information inside its box */
.section.courses .filters-content .item .p-inner ul {
margin-bottom: 0.5rem;
padding-left: 4rem;
}
.section.courses .filters-content .item .p-inner h5 {
  font-size: 15px;
}
.section.courses .filters-content .item .p-inner .cat {
  font-size: 13px;
}
.section.courses .filters-content .item img {
  width: 100%;
}

/**************** Course Details *****************/
.section.courses .filters-content .item .p-inner .private-course-details li,
.section.courses .filters-content .item .p-inner .course-details li {
list-style-type: none;
padding-left: 0.5em;
font: 16px arial, helvetica, sans-serif;
line-height: 1.4;
color: #9999CC;
}
.section.courses .filters-content .item .p-inner .private-course-details li::marker,
.section.courses .filters-content .item .p-inner .course-details li::marker {
font: 16px arial, helvetica, sans-serif;
font-weight: 600;
line-height: 1.4;
color: #CC9966;
}
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(1)::marker,
.section.courses .filters-content .item .p-inner .course-details li:nth-child(1)::marker {
content: "Format:";
}
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(2)::marker,
.section.courses .filters-content .item .p-inner .course-details li:nth-child(2)::marker {
content: "Date/Time:";
}
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(3)::marker {
content: "Classes:";
}
/*
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(4)::marker,
.section.courses .filters-content .item .p-inner .course-details li:nth-child(4)::marker {
content: "Time Zone:";
}
*/
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(4)::marker,
.section.courses .filters-content .item .p-inner .course-details li:nth-child(4)::marker {
content: "Booking:";
}
/* Reposition the internet icon to align it with the telephone icon above it */
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(7),
.section.courses .filters-content .item .p-inner .course-details li:nth-child(7) {
padding-left: 0.34em;
}
/********** Style hyperlinks inside courses boxes**********/
.section.courses .filters-content .item .p-inner .private-course-details li a,
.section.courses .filters-content .item .p-inner .course-details li a {
text-decoration: none;
padding-left: 0.5em;
}
/* unvisited link */
.section.courses .filters-content .item .p-inner .private-course-details li a:link,
.section.courses .filters-content .item .p-inner .course-details li a:link {
color: #CC9966;
}

/* visited link */
.section.courses .filters-content .item .p-inner .private-course-details li a:visited,
.section.courses .filters-content .item .p-inner .course-details li a:visited {
color: #CC9966;
}

/* mouse over link */
.section.courses .filters-content .item .p-inner .private-course-details li a:hover,
.section.courses .filters-content .item .p-inner .course-details li a:hover {
color: #99FF33;
}

/* selected link */
.section.courses .filters-content .item .p-inner .private-course-details li a:active,
.section.courses .filters-content .item .p-inner .course-details li a:active {
  color: blue;
}
/* Reposition the internet hyperlink to align it with the telephone link above it */
.section.courses .filters-content .item .p-inner .private-course-details li:nth-child(7) a,
.section.courses .filters-content .item .p-inner .course-details li:nth-child(7) a {
padding-left: 0.4em;
}