html, body {
  height: 100%;
  margin: 0;
}

body {
  background: none !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url('https://www.fpa.org.uk/wp-content/uploads/2022/07/yt-health-background.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: -1;
  pointer-events: none;
  transform: translateZ(0);
}
	
p, ul, li, ol {
	font-size: 24px;
	line-height: 32px;}

td {font-size: 24px;
	line-height: 32px;}

th {font-size: 18px;}
th p {font-size: 18px;}

.header-wrapper, .page-top, .footer {
	display: none!important;
}

.main-content {
  padding-top: 0px!important;
  padding-bottom: 0px!important;}

.admin-notice {background: #ffeb3b; padding:10px; text-align:center;}

.yt-slide-content .wpb_wrapper p a, .yt-slide-content .wpb_wrapper a {
  color: #005fb9;
  text-decoration: none !important;
  font-weight: 400!important;
}

.yt-slide-content .wpb_wrapper a:hover {
  text-decoration: underline !important;
}

.yt-slide-content .wpb_wrapper a:visited {
  color: #005fb9 !important;
}

.yt-slide-content .wpb_wrapper th p a, 
.yt-slide-content .wpb_wrapper th a,
.yt-slide-content .wpb_wrapper th p a:visited, 
.yt-slide-content .wpb_wrapper th a:visited {
  color: #ffffff!important;
  font-weight: bold!important;
}



li {margin-bottom:12px}
h3 {color: #d04d0a;}

.yt-slide-content {
	background-color: #ffffff;
	padding: 20px;
	border-radius: 10px;
	margin-bottom: 20px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.title-with-image {
    display: flex;
    align-items: center; /* Vertically aligns the image and title */
}

.title-with-image .featured-image {
    margin-right: 15px; /* Adds space between the image and the title */
}

.title-with-image .featured-image img {
  width: 150px;            /* Ensure consistent sizing */
  height: 150px;
  border-radius: 50%;      /* Makes it circular */
  border: 4px solid white; /* White keyline */
  object-fit: cover;       /* Ensures the image fills the circle */
  display: block;
}

.title-text h3, .title-text h1 {
    margin: 0;
}
	
.calloutbox {
		padding: 30px !important;
		background-color: #eaeaea !important;
		border-radius: 30px !important;
	}
.header_menu { 
  position: relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  display: flex;
  flex-direction: row;
  background-color: #482776;
  color: white;
}

.header_title { 
            width: 50%; 
			padding: 10px; 
            text-align: left; 
			color: white;
	}	
.header_title a {  
			color: white;
		   font-weight:800;
		   
	}  
	
.header_logo { 
            width: 270px; 
			padding-top: 5px; 
            text-align: center; 

	}	
	
.header_buttons { 
            width: 40%; 
            padding: 10px; 
			text-align: right;
	} 
.no-breadcrumbs .main-content {
			padding-top: 0px!important;
	}
	
.page_title {
  padding: 10px;
  position: relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #d04d0a;
  margin-bottom: 40px;
}
	
.bar {
border: 1px solid rgb(249, 250, 253);
border-radius: 4px;
border-left: 8px solid transparent;
padding: 7px 23px 7px 18px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 4px;
}
	

	.section_title {font-family: Montserrat, sans-serif;
		color: #482776;
		font-weight: 600;
		font-size: 20px;
		margin: 40px 0px 20px 0px;
	}
	.lesson_section {
		padding-left: 10px;
	}
	.bar-left {
		width: 70%;
		text-align: left; 
	}	
	.bar-right {
		width: 30%;
		text-align: right;
	} 
	
	.btn-primary {border:0px!important; color:#ffffff;}
	
	.header_title .btn { color:#ffffff; border: 1px solid #ffffff!important; background: #482776!important;}
	.header_title .btn:hover { color:#ffffff; border: 1px solid #ffffff!important; background: #d04d0a!important;}
	
	
	
	.vc_general.vc_cta3.vc_cta3-color-purple.vc_cta3-style-flat {background: #482776!important;}
	.vc_general.vc_cta3.vc_cta3-color-purple.vc_cta3-style-flat p, .vc_general.vc_cta3.vc_cta3-color-purple.vc_cta3-style-flat p a {color: #ffffff!important;}
	
	.bar-left:hover {text-decoration:none!important;}
	
	.sec1, .sec1 a {color: rgb(32, 105, 118);}
	.sec2, .sec2 a {color: rgb(208, 77, 10);}
	.sec3, .sec3 a {color: rgb(103, 67, 153);}
	.sec4, .sec4 a {color: rgb(130, 167, 42);}
	.sec5, .sec5 a {color: rgb(32, 105, 118);}
	.sec6, .sec6 a {color: rgb(208, 77, 10);}
	.sec7, .sec7 a {color: rgb(103, 67, 153);}
	.sec8, .sec8 a {color: rgb(130, 167, 42);}
	.sec9, .sec9 a {color: rgb(32, 105, 118);}
	.sec10, .sec10 a {color: rgb(208, 77, 10);}
	
	.sec1 .btn-primary, .sec5 .btn-primary, .sec9 .btn-primary {background-color: rgb(32, 105, 118);}
	.sec1 .btn-primary:hover, .sec5 .btn-primary:hover, .sec9 .btn-primary:hover {background-color: rgb(32, 105, 118, 90%);}
	
	.sec2 .btn-primary, .sec6 .btn-primary, .sec10 .btn-primary {background-color: rgb(208, 77, 10);}
	.sec2 .btn-primary:hover, .sec6 .btn-primary:hover, .sec10 .btn-primary:hover {background-color: rgb(208, 77, 10, 90%);}
	
	.sec3 .btn-primary, .sec7 .btn-primary {background-color: rgb(103, 67, 153);}
	.sec3 .btn-primary:hover, .sec7 .btn-primary:hover {background-color: rgb(103, 67, 153, 90%);}	
	
	.sec4 .btn-primary, .sec8 .btn-primary {background-color: rgb(130, 167, 42);}
	.sec4 .btn-primary:hover, .sec8 .btn-primary:hover {background-color: rgb(130, 167, 42, 90%);}
	
	.sec1 .bar, .sec5 .bar, .sec9 .bar {
		background: rgb(32, 105, 118, 10%);
		color: rgb(32, 105, 118);
		border-left: 10px solid ;
		border-left-color: rgb(32, 105, 118, 10%);
	}
	.sec1 .bar:hover, .sec5 .bar:hover, .sec9 .bar:hover {
		background: rgb(32, 105, 118, 20%);
		border-left-color: rgb(32, 105, 118);
	}
	
	.sec2 .bar, .sec6 .bar, .sec10 .bar {
		background: rgb(208, 77, 10, 10%);
		color: rgb(32, 105, 118);
		border-left: 10px solid ;
		border-left-color: rgb(208, 77, 10, 10%);
	}
	.sec2 .bar:hover, .sec6 .bar:hover, .sec10 .bar:hover {
		background: rgb(208, 77, 10, 20%);
		border-left-color: rgb(208, 77, 10);
	}
	
	.sec3 .bar, .sec7 .bar {
		background: rgb(103, 67, 153, 10%);
		color: rgb(103, 67, 153);
		border-left: 10px solid ;
		border-left-color: rgb(103, 67, 153, 10%);
	}
	.sec3 .bar:hover, .sec7 .bar:hover {
		background: rgb(103, 67, 153, 20%);
		border-left-color: rgb(103, 67, 153);
	}	
	
	.sec4 .bar, .sec8 .bar {
		background: rgb(130, 167, 42, 10%);
		color: rgb(130, 167, 42);
		border-left: 10px solid ;
		border-left-color: rgb(130, 167, 42, 10%);
	}
	.sec4 .bar:hover, .sec8 .bar:hover {
		background: rgb(130, 167, 42, 20%);
		border-left-color: rgb(130, 167, 42);
	}	

	.course {border:20px solid white; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;border-radius: 10px; background-color:#ffffff;}


/* Scope everything under .yasmine-tom-lessons */

.yasmine-tom-lessons {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

/* Make each column container a flex column */
.yasmine-tom-lessons .vc_column_container {
  display: flex;
  flex-direction: column;
}

/* Make any .vc_column-inner fill */
.yasmine-tom-lessons .vc_column_container > .vc_column-inner {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

/* Make .wpb_wrapper inside .vc_column-inner also fill */
.yasmine-tom-lessons .vc_column_container > .vc_column-inner > .wpb_wrapper {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

/* If your link or .lesson-disabled is directly under .vc_column_container, fill */
.yasmine-tom-lessons .vc_column_container > a,
.yasmine-tom-lessons .vc_column_container > div.lesson-disabled {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

/* Make the .course itself fill */
.yasmine-tom-lessons .course {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  position: relative;
}

/* Push the .course-bottom to the bottom */
.yasmine-tom-lessons .course .course-bottom {
  margin-top: auto;
}

/* Fade restricted images */
.yasmine-tom-lessons .restricted-content .image-wrapper img {
  opacity: 0.3;
}

/* Overlay text over image */
.yasmine-tom-lessons .restricted-content .image-wrapper {
  position: relative;
}
.yasmine-tom-lessons .restricted-content .image-wrapper::after {
  content: "Restricted Content";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 1.2em;
  font-weight: bold;
  text-align: center;
  padding: 0.5em 1em;
  background: rgba(0,0,0,0.6);
  border-radius: 4px;
  pointer-events: none;
}

/* Disable clicks if needed */
.yasmine-tom-lessons .lesson-disabled {
  position: relative;
  pointer-events: none;
}

/* Adds space between rows */
.yasmine-tom-lessons .vc_column_container {
  margin-bottom: 20px;
}

.restricted-button {
  background-color: #d04d0a !important;
  border-color: #d04d0a !important;
  color: #ffffff !important;
}

.restricted-button:hover {
  background-color: #b33f08 !important;
  border-color: #b33f08 !important;
}

.message-box {background: #005fb9; color: #fff; padding: 1em; margin: 1em 0; text-align: center; font-size: 1.1em; border-radius: 5px;}



body.trial-member .full-link {
    display: none !important;
}

body.full-member .trial-link {
    display: none !important;
}

/* Optional: hide both if no membership */
body:not(.trial-member):not(.full-member) .trial-link,
body:not(.trial-member):not(.full-member) .full-link {
    display: none !important;
}


.copyright-notice {display:none}

.membership-trial::before {
	content: "Copyright FPA";
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    font-size: 5rem;
    color: rgba(0, 0, 0, 0.1);
    z-index: 1000;
    pointer-events: none;
    white-space: nowrap;
	}

/* Prevent Chrome resize scroll-lock by keeping scrollbar state stable */
html {
  overflow-y: scroll !important;          /* always reserve vertical scrollbar */
  scrollbar-gutter: stable both-edges;    /* modern browsers: keep layout stable */
}

/* If you still have these anywhere, change to min-height instead */
html, body {
  height: auto !important;
  min-height: 100% !important;
}