@charset "UTF-8";
/*
 * Custom CSS for Ascendfit (J51_Maya Template)
 * -------------------------------------------
 * AscendFit colours:
 * Ascend Green: #80c141
 * Ascend Grey: #7a7a7a
 */

 /* Category Descriptions */
 .category-desc {
 	font-size: 1.1em;
 }
 
 /* Push font size on Leading Articles */
 div[class^="leading-"]{
 	font-size: 1.15em;
 }
 
 /* Add space and bottom border to items */
 .category-desc,
 div[class^="leading-"],
 div .items-row {
 	border-bottom: 1px solid #dadada;
 	padding-bottom: 16px;
 	margin-bottom: 17px;
 }
 
 /* --- Form overrides ---*/
 /* Override required field label on RS forms */
 .formRequired{
 	font-size:.6em;
	vertical-align:25%;
 }
 
 /* Make forms in content sit on grey */
 form.form-grey {
 	padding:32px 24px 0 24px;
 	background: #f5f5f5;
 }
 
 /* Make fields wide instead of stupid Bootstrap default */
 form.wide-fields .formControls input,
 form.wide-fields .formControls textarea {
 	width: 75%;
 }
 
 /* Add section markers with .show-sections */
 form.show-sections div.row-fluid {
 	background: #e9e9e9;
	margin-bottom: 16px;
	padding: 16px 0 0 0;
 }
  
 /* Image captions */
 .img_caption p {
 	text-align: center;
 	font-style: italic;
 	font-size: .8em;
 	font-weight: 600;
 	color: #7e7e7e;
 	padding:16px 4px;
 }
  
  
 /*Hide required label on Captchas called "nobots" */
 div.rsform-block-nobots label{
 	visibility: hidden;
 	display: none;
 }
 
 /* Hide labels on form with .nolabels class */
 form.nolabels label {
 	display: none;
 }
 
 form.nolabels div.controls {
 	margin-left: 0;
 }
 
 /* Tweak colours of Datetime picker - Light theme */
 .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current {
 	background: #9fd311 !important;
 	box-shadow: #333 0 1px 3px 0 inset !important;
 }
 
 /* Correct sizing of Datetime picker button */
 input.btn.rsform-calendar-button {
 	margin:0;
 	padding: 6px 10px;
 }
 
 /* Utility Classes */
 .text-green{
 	color: #6ba237; /* Darker shade of Ascend Green */
 }
 
 .text-center{
 	text-align:center;
 }
 
 .text-allcaps{
 	text-transform: uppercase;
 }
 
 .text-alert,
 .text-warn,
 .text-info,
 .text-suggest {
 	padding: 4px 8px;
 }
 
 /* Alert - Red HSB - */ 
 .text-alert {
 	background: #F2E6E6;  /* hsb - 0 5 95*/
 	border: 2px solid #BD3336; /* hsb - 0 73 74 */
 }
 
 /* Warn - Orange */
 .text-warn {
 	background: #F2ECE6; /* hsb - 30 5 95*/
 	border: 2px solid #BD7833; /* hsb - 30 73 74*/
 }
 
 /* Info - Blue */
 .text-info {
 	background: #E6E6F2; /* hsb - 240 5 95*/
 	border: 2px solid #3333bd; /* hsb - 240 73 74*/
 }
 
 /* Suggest - Green */
 .text-suggest {
 	background: #E8F2E6; /* hsb - 113 5 95*/
 	border: 2px solid #43bd33; /* hsb - 113 73 74*/
 }
 
 /* Classes to colour FA icons */
 .fa.icon-red::before {
 	color: #BD3336;
 }
 
 .fa.icon-orange::before {
 	color: #BD7833;
 }
 
 .fa.icon-blue::before {
 	color: #3333bd;
 }
 
 .fa.icon-green::before {
 	color: #43bd33;
 }
 
 .fa.icon-black::before {
 	color: #000;
 }
 
 .fa.icon-white::before {
 	color: #fff;
 }
 
 ul.nobullet{
 	list-style: none;
 }
 
 /* Block quotes and Testimonials */
 blockquote.testimonial {
 	text-align: center;
 	margin: 24px 0;
 	padding-top:16px;
 }
 
 blockquote.testimonial:before {
 	content: "\201C";
	font-family: sans-serif;
	font-size: 88px;
	position: absolute;
	left: 50%;
	top: 0;
	color: rgba(0,0,0,0.5);
 }
 
 blockquote.testimonial cite {
 	display: block;
 	margin-top:1em;
 	font-weight: 600;
 	font-style:italic;
 	color: rgba(0,0,0,0.5);
 }
 
 
 
 
 /* CTA styling for modules */
div.cta .module_header h3{
	text-align: center !important;
	color: #9fd311 !important;
} 

div.cta {
	text-align: center;
}
 
 
 /* Page class for suppressing row seperators - used on services page */
 .blog.no-seperator .items-row{
 	border-bottom: none;
 }
  
 /* Remove black border from iframes (like the PTD Login and signup forms) */
 iframe {
 	border: none;
 }
 
 /* Style the .login-link menu option seperatly */
 .menu a.login-link {
 	background: #9fd311;
 }
 
 /*
  * Attempt to create legal numbering using CSS counter
  * A "legal-section" resets the counters for the following section and paras
  */
 
 /* Start a legal numbering section - Reset Section counter */
  div.legal-number {
 	counter-reset: legalsection;
 }
 
 /* If we have a h2, we need to reset the paragraph counter for that section */
 .legal-number h2 {
 	counter-reset: legalparagraph;
 }
 /* Add the Section number before the h2 text, and increment the section counter */
 div.legal-number h2::before{
 	content: counter(legalsection) "\00a0";
 	counter-increment: legalsection;
 }
 
 /* At the start of each paragraph add the current section and Paragraph number and increment the paragraph counter. */
 .legal-number p::before {
 	content: counter(legalsection) "." counter(legalparagraph) "\00a0";
 	counter-increment: legalparagraph;
 }
 
 /* Indent the para a bit */
 .legal-number p{
 	margin-left:1em;
 }
 
 /* Deal with 3rd and 4th level lists in paras */

.legal-number ol{
	list-style: lower-latin;
	margin-left:4em;
}

.legal-number ol ol{
	list-style: lower-roman;
	margin-left:1.2em;
}
 
 /* Style for header blocks */
 div.header-block{
 	max-width:600px;
 	margin:0 auto;
 	text-align:center;
 	font-size: 1.25em;
 }
 
 /* Style the Services articles */
 div.service-header{
 	text-align:center;
 	margin:0 auto;
 	background: #f5f5f5;
 	padding:30px 40px;
 	margin-bottom:32px;
 }
 
 div.service-header h2{
 	text-transform: uppercase;
 }
 
/*
 * Grid based blocks for services page
 */
.sv-container {
	display: grid;
	grid-template-columns: 320px 1fr; /* left side 320 px wide for images */
	grid-column-gap:16px;
	grid-row-gap:16px;
	grid-template-areas: "sv-head sv-head" "sv-left sv-right";
}

.sv-head{
	grid-area:sv-head;
	background: #f5f5f5;
	text-align: center;
	padding:32px 64px 8px 64px;
}

.sv-left{
	grid-area:sv-left;
}

.sv-right{
	grid-area:sv-right;
}

.sv-right h3:first-of-type{
	text-align: right;
}

.sv-right a.btn {
	float:right;
}

/* Flex Block for the Contact Page */
.flex-row {
	display: flex;
	flex-direction: row;
}

.fr-left25 {
	order: 1;
	width:25%;
	margin-right:16px;
}

.fr-right75{
	order: 2;
	width:75%;
}

.fr-grey{
	padding:32px 24px 0 24px;
 	background: #f5f5f5;
}

/* Add a bit of shadow to the text on the heros and bump the paragraph size up a bit */
.layerslideshow .item h2 {
	text-shadow:2px 2px 2px #333;
}

/* add a dark bg to teh caption so we can read it over light images */
.layerslideshow .item .caption {
	background: rgba(0,0,0,.25);
	padding: 4px 8px;
}

.layerslideshow .item p{
	font-size:1.25em;
	text-shadow:2px 2px 2px #000;
}

.j51_inlineicons ul {
	list-style-type: none;
	margin: 0;
}

/* Style the Email signup in base2 modules */
#base2_modules div.control-group{
	margin-bottom:0;
	padding-left:4px;
}

#base2_modules .rsform-input-box {
	width: 80%;
}

/* Btn class overrides */
.btn.btn-dark {
  color: #fff;
	background: #000;
  
}

/* ----------- Event Booking Overrides --------------- */
/* Circular date Buttons on timeline view */
.eb-event-date.btn-inverse{
  background: #80c141;
  transition: background .25s;
}
.eb-event-date.btn-inverse:hover{
  background: #7a7a7a;
  transition: background .25s;
}

.ebm-upcoming-events-improved div.ebm-event-month {
    background: #80c141 !important;
    border: 1px solid #80c141 !important;
    font-size:.85em;
}

.ebm-upcoming-events-improved div.ebm-event-day {
    border: 1px solid #80c141 !important;
    color: #252422 !important;
}


/* -------------- Media Queries -------------- */

/* Break point < 520px wide */
@media screen and (max-width: 520px) {
	/* Give up any flash bollocks and just stack them */
	.sv-container,
	.sv-head,
	.sv-left,
	.sv-right {	
		display: block;
	}
	
	.sv-head,
	.sv-left,
	.sv-right {
		margin-bottom:4px;
	}
	
	.sv-left {
		text-align: center;/* Centers the image */
	}
}

/* Break point < 700 px */

@media screen and (max-width: 699px) {
	/* Make Flex row vertical insteadod of horizontal */
	.flex-row {
		flex-direction: column;
	}
	
	/* Make stacked items 100% wide */
	.fr-left25,
	.fr-right75 {
		width:100%;
		margin-right:0;
	}
	
	/* Make Services Layout Stack */
	.sv-container {	
		grid-template-columns: 160px 1fr; /* left side image to half size */
		grid-column-gap:8px; /* Reduce gaps */
		grid-row-gap:8px;
	}
	
} /* END - < 700px */

