/**
* AJR Design - Universal Styles (frontend and backend)
*
* @package    AJR Design Plugin
* @since      230415.0
* @subpackage ajr-design-plugin/assests/css
**/

/* ---------------------------------------------------------------------
VARIABLES
--------------------------------------------------------------------- */
:root {

    /* LAYOUT ---------------------------------------------------------------- */
    --layout_max_width_full: 100%;
    --layout_max_width_wide: 1400px;
    --layout_max_width: 1000px;
    --layout_max_width_narrow: 800px;
    --layout_max_width_homepage: 1200px;
    --layout_margin: 2.5rem;
    --layout_padding: 2rem;
    --layout_content_margin: 1.5em;
    --layout_content_margin_half: calc(var(--layout_content_margin) / 2);
    --layout_content_margin_small: 1em;
    --wp--style--global--wide-size: var(--layout_max_width_wide);
    --wp--style--global--content-size: var(--layout_max_width);

    /* SCROLLBARS ---------------------------------------------------------------- */
    --scrollbar_size:0.5rem;
    --scrollbar_track_border_radius: var(--scrollbar_size);
    --scrollbar_thumb_border_radius: var(--scrollbar_size);
    --scrollbar_track_horz_border_radius: var(--scrollbar_size);

    /* LOADING ---------------------------------------------------------------- */
    /*--loading_url:url('/images/loading.gif');*/
    --loading_size:100px;
    --loading_opacity:0.25;

    /* WIDTHS -------------------------------------------------------------------- */
    --width_site:1200px;
    --width_content:900px;
    --width_wide:1100px;
    --width_input:100%;

    /* HEIGHT --------------------------------------------------------------------- */
    --height_input:32px;
    --height_textarea:4em;

    /* FLEX ---------------------------------------------------------------------- */
    --flex_gap_post:1rem;
    --flex_gap_gallery:1rem;
    --flex_gap:1rem;
    --flex_gap_smallest:calc(var(--flex_gap) / 8);
    --flex_gap_xxxtiny:calc(var(--flex_gap) / 6);
    --flex_gap_xxtiny:calc(var(--flex_gap) / 5);
    --flex_gap_xtiny:calc(var(--flex_gap) / 4);
    --flex_gap_tiny:calc(var(--flex_gap) / 3);
    --flex_gap_small:calc(var(--flex_gap) / 2);
    --flex_gap_smaller:calc(var(--flex_gap) / 1.5);
    --flex_gap_medium:calc(var(--flex_gap) * 1.5);
    --flex_gap_large:calc(var(--flex_gap) * 2);

    /* MARGIN -------------------------------------------------------------------- */
    --margin_heading:2em auto -0.25em;
    --margin_heading_top:1.5em;
    --margin_heading_bottom:0;/*-0.25em;*/
    --margin_subheader:0.5em auto 0;
    --margin:2rem;
    --margin_smallest:calc(var(--margin) / 10);
    --margin_xxxtiny:calc(var(--margin) / 7);
    --margin_xxtiny:calc(var(--margin) / 5);
    --margin_xtiny:calc(var(--margin) / 4);
    --margin_tiny:calc(var(--margin) / 3);
    --margin_smaller:calc(var(--margin) / 2);
    --margin_small:calc(var(--margin) / 1.5);
    --margin_medium:calc(var(--margin) * 1.5);
    --margin_large:calc(var(--margin) * 2);

    /* PADDING ------------------------------------------------------------------- */
    --padding_top_page:0;
    --padding_bottom_page:0;
    --padding_container:2rem;
    --padding_container_small:1.5rem;
    --padding_container_xsmall:1.25rem;
    --padding_container_xxsmall:1rem;
    --padding_container_tiny:0.75rem;
    --padding_container_xtiny:0.5rem;
    --padding_container_xxtiny:0.25rem;
    --padding_textarea:0.5em 1em;
    --padding_message:0.75em 1.25em 0.85em;
    --padding_button:0.6em 1.2em 0.6em;
    --padding_button_uppercase:0.45em 1.25em 0.45em;

    /* FORMS --------------------------------------------------------------------- */
    --form_spacing:0.25em;
    --form_input_height:32px;
    --form_textarea_height:50px;

    /* FONTS --------------------------------------------------------------------- */
    --font_size_default:1rem;
    --font_size_h1:calc(var(--font_size_default) * 2.2);
    --font_size_h2:calc(var(--font_size_default) * 1.8);
    --font_size_h3:calc(var(--font_size_default) * 1.6);
    --font_size_h4:calc(var(--font_size_default) * 1.4);
    --font_size_h5:calc(var(--font_size_default) * 1.2);
    --font_size_h6:calc(var(--font_size_default) * 1.0);
    --font_size_input:1em;
    --font_size_button:0.85em;
    --font_size_button_edit:0.65em;
    --font_size_placeholder:0.9em;

    --font_weight_heading:500;
    --font_weight_button:400;
    --font_weight_placeholder:300;

    /* COLOURS ------------------------------------------------------------------- */
    --colour_red: 240,0,0;
	--colour_green: 0,200,0;
	--colour_blue: 0,50,255;
    --colour_orange: 255,140,0;
    
    --colour_background_admin:240,240,241;
    --colour_background:245,245,245;
    --colour_background_form:250,250,250;
    --colour_background_overlay:rgba(0,0,0,0.5);
    --colour_background_loading:rgba(255,255,255,1);

    --colour_accent_darkest:150,0,50;
    --colour_accent_darker:175,0,50;
    --colour_accent_dark:225,0,60;
    --colour_accent:255,0,100;
    --colour_accent_light:255,75,125;
    --colour_accent_lighter:255,140,160;
    --colour_accent_lightest:255,225,225;
    --colour_accent_hover:var(--colour_accent_light);
    --colour_accent_active:var(--colour_accent_dark);

    --colour_star:255,220,0;

    --colour_active:50,200,50;
    --colour_active_hover:20,100,20;
    --colour_active_active:20,200,20;

    --colour_success:20,150,20;
    --colour_success_hover:20,100,20;
    --colour_success_active:20,200,20;

    --colour_error:255,175,75;
    --colour_error_hover:255,125,75;
    --colour_error_active:255,225,75;

    --colour_warning:220,0,0;
    --colour_warning_hover:225,50,50;
    --colour_warning_active:180,0,0;

    --colour_negative:200,0,0;

    --colour_table_odd:240,240,240;
    --colour_table_even:245,245,245;
    --colour_table_hover:255,255,255;

    --colour_ribbon:var(--colour_accent);
    --colour_ribbon_dark:var(--colour_accent_dark);

    --colour_divider:#eeeeee;

    --colour_status_:var(--colour_accent);				/* default */
    --colour_status__dark:var(--colour_accent_dark);
    --colour_status_1:var(--colour_status_);			/* coming soon */
    --colour_status_1_dark:var(--colour_status__dark);
    --colour_status_1_5:0,160,220;						/* foster */
    --colour_status_1_5_dark:0,100,160;
    --colour_status_2:var(--colour_status_);			/* available */
    --colour_status_2_dark:var(--colour_status__dark);
    --colour_status_3:250,180,0;						/* home check */
    --colour_status_3_dark:200,120,0;
    --colour_status_4:0,200,0;							/* reserved */
    --colour_status_4_dark:0,120,0;
    --colour_status_5:60,200,60;						/* transport */
    --colour_status_5_dark:0,120,0;
    --colour_status_6:var(--colour_status_);			/* adopted */
    --colour_status_6_dark:var(--colour_status__dark);

    --colour_link:var(--colour_accent);
    --colour_link_hover:var(--colour_accent_light);
    --colour_link_active:var(--colour_accent_dark);

    --colour_button:var(--colour_accent);
    --colour_button_hover:var(--colour_accent_light);
    --colour_button_active:var(--colour_accent_dark);
    --colour_button_invert:255,255,255;

    --colour_black:0,0,0;
    --colour_grey_darkest:10,10,10;
    --colour_grey_darkerererer:20,20,20;
    --colour_grey_darkererer:35,35,35;
    --colour_grey_darkerer:50,50,50;
    --colour_grey_darker:75,75,75;
    --colour_grey_dark:100,100,100;
    --colour_grey:125,125,125;
    --colour_grey_light:150,150,150;
    --colour_grey_lighter:175,175,175;
    --colour_grey_lighterer:200,200,200;
    --colour_grey_lightererer:220,220,220;
    --colour_grey_lighterererer:235,235,235;
    --colour_grey_lightest:245,245,245;
    --colour_white:255,255,255;

    --colour_text:75,75,75;
    --colour_subtext:150,150,150;
    --colour_placeholder:var(--colour_grey_lighter);

    /* LETTER-SPACING ------------------------------------------------------------ */
    --letter_spacing_button:0.02em;

    /* LINE-HEIGHT --------------------------------------------------------------- */
    --line_height_default:1.5em;
    --line_height_heading:1em;
    --line_height_textarea:1.5em;
    --line_height_button:1.2em;

    /* LINE-CLAMP --------------------------------------------------------------- */
    --line_clamp_title:2;
    --line_clamp_content:4;
    --line_clamp_nav:1;

    /* TEXT-TRANSFORM ------------------------------------------------------------ */
    --text_transform_button:normal;

    /* BORDER -------------------------------------------------------------------- */
    --border_width_button:1px;
    --border_style_button:solid;
    --border_color_button:transparent;
    --border_button:var(--border_width_button) var(--border_style_button) var(--border_color_button);
    --border_radius:8px;
    --border_radius_button:4px;
    --border_radius_item:10px;
    --border_radius_item_posts:4px;
    --border_radius_item_gallery:5px;
    --border_radius_item_message:8px;
    --border_radius_form:10px;
    --border_radius_input:4px;

    /* SHADOWS ---------------------------------------------------------------- */
    --text_shadow: 1px 1px 3px #000;
    --box_shadow: 0 2px 20px 0 rgba(0,0,0,0.2);
    --box_shadow_popup: var(--box_shadow, 0 2px 10px -2px rgba(0,0,0,0.5));
    --box_shadow_item: 0 0 15px 0 rgba(0,0,0,0.05);
    --box_shadow_item_hover: 0 0 20px 0 rgba(0,0,0,0.15);
    --box_shadow_posts: 0 2px 20px 0 rgba(0,0,0,0.15);
    --box_shadow_posts_hover: 0 2px 40px 0 rgba(0,0,0,0.4);
    --box_shadow_gallery: 0 2px 20px 0 rgba(0,0,0,0.15);
    --box_shadow_gallery_hover: 0 0 0 1px rgba(255,255,255,0.5), 0 2px 40px 0 rgba(0,0,0,0.4);
    --box_shadow_message: 0 1px 15px 0 rgba(0,0,0,0.2);
    --box_shadow_morph: -10px -10px 10px 0 rgba(255,255,255,0.75), 10px 10px 10px 0 rgba(0,0,0,0.075);
    --box_shadow_morph_small: -5px -5px 10px 0 rgba(255,255,255,0.75), 5px 5px 10px 0 rgba(0,0,0,0.075);
    --box_shadow_inset: inset 0 0 10px 0 rgba(0,0,0,0.15);
    --box_shadow_divider_convex_top: 0 -1px 0 0 rgba(255,255,255,0.5), inset 0 1px 0 0 rgba(0,0,0,0.05);
    --box_shadow_divider_convex_bottom: inset 0 -1px 0 0 rgba(255,255,255,0.5), 0 1px 0 0 rgba(0,0,0,0.05);
    --box_shadow_divider_convex_left: -1px 0 0 0 rgba(255,255,255,0.5), inset 1px 0 0 0 rgba(0,0,0,0.05);
    --box_shadow_divider_convex_left: inset -1px 0 0 0 rgba(255,255,255,0.5), 1px 0 0 0 rgba(0,0,0,0.05);
    --box_shadow_divider_concave_top: 0 -1px 0 0 rgba(0,0,0,0.05), inset 0 1px 0 0 rgba(255,255,255,0.5);
    --box_shadow_divider_concave_bottom: inset 0 -1px 0 0 rgba(0,0,0,0.05), 0 1px 0 0 rgba(255,255,255,0.5);
    --box_shadow_divider_concave_left: -1px 0 0 0 rgba(0,0,0,0.05), inset 1px 0 0 0 rgba(255,255,255,0.5);
    --box_shadow_divider_concave_left: inset -1px 0 0 0 rgba(0,0,0,0.05), 1px 0 0 0 rgba(255,255,255,0.5);

    /* TRANSITIONS ---------------------------------------------------------------- */
    --transition:0.6s ease-out;
    --transition_hover:0.3s ease-in;
    --transition_active:0.3s ease;
    --transition_fast:0.15s ease-out;
    --transition_fast_hover:0.15s ease-in;
    --transition_fast_active:0.15s ease;
    --transition_cb:cubic-bezier(0.5, 0, 0.5, 1.5);
    --transition_cb_active:cubic-bezier(0.5, -0.5, 0.5, 1);
    --transition_cb_both:cubic-bezier(0.5, -0.5, 0.5, 1.5);
    --transition_cb_fast:cubic-bezier(.25,.25,0.75,1.5);
    --transition_cb_fast_active:cubic-bezier(.25,.25,0.75,1.5);
    --transition_cb_fast_both:cubic-bezier(.25,.25,0.75,1.5);
}


/* ------------------------------------------------------------------------------------------------ */
/* ANIMATION
/* --------------------------------------------------------------------------------------------- */
.ajr_blink        { -webkit-animation: ajr_flash_1 0.6s linear 2 both; animation: ajr_flash_1 0.6s linear 2 both; }
.ajr_blink_2      { -webkit-animation: ajr_flash_2 1.1s linear 3 both; animation: ajr_flash_2 1.1s linear 3 both; }
.ajr_blink_3      { -webkit-animation: ajr_flash_3 1.6s linear 4 both; animation: ajr_flash_3 1.6s linear 4 both; }
@-webkit-keyframes ajr_flash_1 { 0%,60% { opacity: .35; } 30%         { opacity: 1; } 61%,100% { opacity: 0; } }
@keyframes ajr_flash_1         { 0%,60% { opacity: .35; } 30%         { opacity: 1; } 61%,100% { opacity: 0; } }
@-webkit-keyframes ajr_flash_2 { 0%,54% { opacity: .35; } 18%,36%     { opacity: 1; } 55%,100% { opacity: 0; } }
@keyframes ajr_flash_2         { 0%,54% { opacity: .35; } 18%,36%     { opacity: 1; } 55%,100% { opacity: 0; } }
@-webkit-keyframes ajr_flash_3 { 0%,48% { opacity: .35; } 16%,32%,48% { opacity: 1; } 49%,100% { opacity: 0; } }
@keyframes ajr_flash_3         { 0%,48% { opacity: .35; } 16%,32%,48% { opacity: 1; } 49%,100% { opacity: 0; } }

.ajr_flash_xfast  { -webkit-animation: ajr_flash 0.1s linear infinite; animation: ajr_flash 0.1s linear infinite; }
.ajr_flash_vfast  { -webkit-animation: ajr_flash 0.3s linear infinite; animation: ajr_flash 0.3s linear infinite; }
.ajr_flash_fast   { -webkit-animation: ajr_flash 0.5s linear infinite; animation: ajr_flash 0.5s linear infinite; }
.ajr_flash		  { -webkit-animation: ajr_flash 1.0s linear infinite; animation: ajr_flash 1.0s linear infinite; }
.ajr_flash_slow   { -webkit-animation: ajr_flash 1.5s linear infinite; animation: ajr_flash 1.5s linear infinite; }
.ajr_flash_vslow  { -webkit-animation: ajr_flash 1.7s linear infinite; animation: ajr_flash 1.7s linear infinite; }
.ajr_flash_xslow  { -webkit-animation: ajr_flash 1.9s linear infinite; animation: ajr_flash 1.9s linear infinite; }
@-webkit-keyframes ajr_flash { 0%,100% { opacity: 0.35; } 50% { opacity: 1; } }
@keyframes ajr_flash		 { 0%,100% { opacity: 0.35; } 50% { opacity: 1; } }

.ajr_spin_fast    { -webkit-animation: ajr_spin 0.5s linear infinite; animation: ajr_spin 0.5s linear infinite; }
.ajr_spin         { -webkit-animation: ajr_spin 1.0s linear infinite; animation: ajr_spin 1.0s linear infinite; }
.ajr_spin::before { -webkit-animation: ajr_spin 1.0s linear infinite; animation: ajr_spin 1.0s linear infinite; }
.ajr_spin_slow    { -webkit-animation: ajr_spin 1.5s linear infinite; animation: ajr_spin 1.5s linear infinite; }
@-webkit-keyframes ajr_spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } }
@keyframes ajr_spin         { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }


/* ------------------------------------------------------------------------------------------------ */
/* COLOURS
/* --------------------------------------------------------------------------------------------- */
.red, .colour_red { color:rgb(var(--colour_red)) !important; }
.green, .colour_green { color:rgb(var(--colour_green)) !important; }
.blue, .colour_blue { color:rgb(var(--colour_blue)) !important; }
.orange, .colour_orange { color:rgb(var(--colour_orange)) !important; }

.bgd_red { background: rgb(var(--colour_red)) !important; }
.bgd_green { background: rgb(var(--colour_green)) !important; }
.bgd_success { background: rgb(var(--colour_success)) !important; }
.bgd_blue { background: rgb(var(--colour_blue)) !important; }
.bgd_orange { background: rgb(var(--colour_orange)) !important; }

.highlight_change {
    background: #00ff00 /*rgba(var(--colour_success),0.75)*/ !important;
    transition: background 0s ease-in; }
.highlight_change_text {
    color: rgb(var(--colour_green)) !important;
    transition: color 0s ease-in; }
    .badge .highlight_change_text {
        color: rgb(var(--colour_red)) !important; }
.highlight_change_remove {
    color: rgb(var(--colour_red)) !important;
    background: rgb(var(--colour_warning_lightest)) !important;
    opacity: 0;
    transition: background 0s ease-in, opacity 0.5s ease-out 2.5s !important; }
    .highlight_change_remove > * {
        color: rgb(var(--colour_red)) !important; }


/* --------------------------------------------------------------------------------------------- */
/* HTML/CSS DEFAULTS
/* --------------------------------------------------------------------------------------------- */
* { box-sizing: border-box; }
table {
    border-collapse: collapse; }


/* --------------------------------------------------------------------------------------------- */
/* SCROLLBARS
* 		Works on firefox
::-webkit-	Works on Chrome, Edge, and Safari
/* --------------------------------------------------------------------------------------------- */
* { scrollbar-width: var(--scrollbar_size); scrollbar-color: rgb(var(--colour_background)); }

::-webkit-scrollbar			{ width:var(--scrollbar_size); height:var(--scrollbar_size); }
::-webkit-scrollbar-corner		{ background-color:transparent; }
::-webkit-scrollbar-track		{ background-color:rgb(var(--colour_background)); background-clip:padding-box; border-radius:var(--scrollbar_track_border_radius); }

::-webkit-scrollbar-thumb 		{ background-color:rgba(var(--colour_grey),0.25); border-radius:var(--scrollbar_thumb_border_radius); }
::-webkit-scrollbar-thumb:hover		{ background-color:rgba(var(--colour_grey),0.5); }
::-webkit-scrollbar-thumb:active	{ background-color:rgb(var(--colour_accent_light)); }

::-webkit-scrollbar-thumb:vertical	{ background-clip:padding-box; border:var(--scrollbar_size) solid transparent; border-left:none; }
::-webkit-scrollbar-thumb:horizontal	{ height:var(--scrollbar_size); }
::-webkit-scrollbar-track:horizontal	{ border-radius:var(--scrollbar_track_horz_border_radius); }


/* ---------------------------------------------------------------------
RESPONSIVENESS
--------------------------------------------------------------------- */
@media screen and (max-device-width:899px) {
    body {
        /* font */
        font-size:calc(16px * 1) !important;
        --font_size_default:0.9rem;
        --font_size_h1:calc(var(--font_size_default) * 2.5);
        --font_size_h2:calc(var(--font_size_default) * 2);
        --font_size_h3:calc(var(--font_size_default) * 1.8);
        --font_size_h4:calc(var(--font_size_default) * 1.6);
        --font_size_h5:calc(var(--font_size_default) * 1.4);
        --font_size_h6:calc(var(--font_size_default) * 1.2);
        --font_size_button:0.9em;

        /* margin */
        --margin_heading_top:2em;
    }
}
@media screen and (max-device-width:599px) {
    body {
        /* font */
        font-size:calc(16px * 0.9) !important;
        --font_size_default:0.8rem;
        --font_size_h1:calc(var(--font_size_default) * 2.5);
        --font_size_h2:calc(var(--font_size_default) * 2);
        --font_size_h3:calc(var(--font_size_default) * 1.8);
        --font_size_h4:calc(var(--font_size_default) * 1.6);
        --font_size_h5:calc(var(--font_size_default) * 1.4);
        --font_size_h6:calc(var(--font_size_default) * 1.2);

        /* padding */
        --padding_button:0.6em 1.2em 0.7em; }
}


/* ------------------------------------------------------------------------------------------------ */
/* CONTAINERS */
/* ------------------------------------------------------------------------------------------------ */
/* flex */
.flex_container,
.flex {
	position: relative;
	display: -webkit-flex; display: flex;
	width: 100%; }
	
	/* flex_item */
    .flex_item {
        display: -webkit-flex; display: flex; }

    /* flex_row */
    .flex_row {
        display: -webkit-flex; display: flex;
        -webkit-flex-direction: row; flex-direction: row; }
	
    /* flex_column */
    .flex_column {
        display: -webkit-flex; display: flex;
        -webkit-flex-direction: column; flex-direction: column; }
	
	/* flex direction */
	.f_d_c { -webkit-flex-direction:column; flex-direction:column; }
	.f_d_cr { -webkit-flex-direction:column-reverse; flex-direction:column-reverse; }
	.f_d_r { -webkit-flex-direction:row !important; flex-direction:row !important; }
	.f_d_rr { -webkit-flex-direction:row-reverse; flex-direction:row-reverse; }

	/* flex width */
    .f_w_100 { width: 100%; }
	.f_w_auto { width: auto; }

	/* flex basis */
	.f_b_1 { flex:1; }

    /* flex grow */
    .f_g { -webkit-flex-grow: 1; flex-grow: 1; }

	/* margins */
    .f_mr_a { margin-right:auto; }
	.f_ml_a { margin-left:auto; }

	/* flex wrap */
	.f_w_y { -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
	.f_w_n { -webkit-flex-wrap:nowrap; -ms-flex-wrap:nowrap; flex-wrap:nowrap; }
	
	/* flex justify */
	.f_jc_c { -webkit-justify-content:center; justify-content:center; }
	.f_js_c { -webkit-justify-self:center; justify-self:center; }
	.f_jc_fs { -webkit-justify-content:flex-start; justify-content:flex-start; }
	.f_js_fs { -webkit-justify-self:flex-start; justify-self:flex-start; }
	.f_jc_fe { -webkit-justify-content:flex-end; justify-content:flex-end; }
	.f_js_fe { -webkit-justify-self:flex-end; justify-self:flex-end; }
	.f_jc_sa { -webkit-justify-content:space-around; justify-content:space-around; }
	.f_js_sa { -webkit-justify-self:space-around; justify-self:space-around; }
	.f_jc_sb { -webkit-justify-content:space-between; justify-content:space-between; }
	.f_js_sb { -webkit-justify-self:space-between; justify-self:space-between; }
	.f_jc_se { -webkit-justify-content:space-evenly; justify-content:space-evenly; }
	.f_js_se { -webkit-justify-self:space-evenly; justify-self:space-evenly; }
	
	/* flex align */
	.f_ac_c { -webkit-align-content:center; align-content:center; }
	.f_ac_fs { -webkit-align-content:flex-start; -ms-flex-line-pack:start; align-content:flex-start; }
	.f_ac_fe { -webkit-align-content:flex-end; align-items:flex-end; }
	.f_ai_c { -webkit-align-items:center; align-items:center; }
	.f_as_c { -webkit-align-self:center; align-self:center; }
	.f_ai_fs { -webkit-align-items:flex-start; align-items:flex-start; }
	.f_as_fs { -webkit-align-self:flex-start; align-self:flex-start; }
	.f_ai_fe { -webkit-align-items:flex-end; align-items:flex-end; }
	.f_as_fe { -webkit-align-self:flex-end; align-self:flex-end; }
	.f_ai_b { -webkit-align-items:baseline; align-items:baseline; }

	/* flex columns */
	.f_c_1 { -webkit-flex:1; -ms-flex:1; flex:1; }
	.f_c_2 { -webkit-flex:2; -ms-flex:2; flex:2; }
	.f_c_3 { -webkit-flex:3; -ms-flex:3; flex:3; }
	.f_c_4 { -webkit-flex:4; -ms-flex:4; flex:4; }
	.f_c_5 { -webkit-flex:5; -ms-flex:5; flex:5; }
	.f_c_6 { -webkit-flex:6; -ms-flex:6; flex:6; }
	.f_i_a { flex:auto; }
	.f_i_20 { flex:20%; }
	.f_i_25 { flex:25%; }
	.f_i_33 { flex:33.33%; }
	.f_i_50 { flex:50%; }
	.f_i_66 { flex:66.66%; }
	.f_i_75 { flex:75%; }
	.f_i_80 { flex:80%; }
	.f_i_100 { flex:100%; }


/* ------------------------------------------------------------------------------------------------ */
/* TABLES */
/* ------------------------------------------------------------------------------------------------ */
.div_table {
    display: table;
    width: 100%; }
.div_table_header_group {
    display: table-header-group; }
.div_table_row {
    display: table-row; }
.div_table_cell {
    display: table-cell; }

/* ------------------------------------------------------------------------------------------------ */
/* WIDTHS */
/* ------------------------------------------------------------------------------------------------ */
.width_full,
.width_100,
.width_75,
.width_66,
.width_60,
.width_50,
.width_40,
.width_33,
.width_25,
.width_20 {
    flex-basis: unset; }
.width_full {
    max-width: none !important; }
.width_100 {
    /*flex: 1 100%;*/
    width: 100% !important;
    margin: var(--margin_item) !important; }
.width_75 {
    /*flex: 1 calc(75% - (var(--margin_item) * 2));*/
    width: calc(75% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_66 {
    /*flex: 1 calc(66.66% - (var(--margin_item) * 2));*/
    width: calc(66.66% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_60 {
    /*flex: 1 calc(60% - (var(--margin_item) * 2));*/
    width: calc(60% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_50 {
    /*flex: 1 calc(50% - (var(--margin_item) * 2));*/
    width: calc(50% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_40 {
    /*flex: 1 calc(40% - (var(--margin_item) * 2));*/
    width: calc(40% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_33 {
    /*flex: 1 calc(33.33% - (var(--margin_item) * 2));*/
    width: calc(33.33% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_25 {
    /*flex: 1 calc(25% - (var(--margin_item) * 2));*/
    width: calc(25% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
.width_20 {
    /*flex: 1 calc(20% - (var(--margin_item) * 2));*/
    width: calc(20% - (var(--margin_item) * 2)) !important;
    margin: var(--margin_item) !important; }
@media screen and (max-width:767px) {
    .width_75 {
        /*flex: 1 100%;*/
        width: 100% !important;
        margin: var(--margin_item) !important; }
    .width_66,
    .width_60,
    .width_50,
    .width_40,
    .width_33,
    .width_25,
    .width_20 {
        /*flex: 1 calc(50% - (var(--margin_item) * 2));*/
        width: calc(50% - (var(--margin_item) * 2)) !important;
        margin: var(--margin_item) !important; }
}


/* --------------------------------------------------------------------------------------------- */
/* POPUPS & OVERLAYS
/* --------------------------------------------------------------------------------------------- */
html.has-modal-open,
html.has-modal-open body {
    overflow:hidden !important; }

body {
    -webkit-font-smoothing: antialiased;
    /*overflow:overlay;*/ }
body:not(.wp-admin) {
	opacity:0;
	transition: opacity var(--transition); }
	body.ajrdesign_ready:not(.wp-admin) {
		opacity:1; }

body::before,
body::after {
	content:'';
	transition: opacity var(--transition); }
body::before {
	background:transparent; }
body::after {
	opacity:0; }

body.popup_active::before,
body:not(.ajrdesign_ready):not(.editor-styles-wrapper)::before,
body.ajrdesign_loading::before {
	content:'';
	position:fixed;
	z-index:999998;
	top:0;
	left:0;
	right:0;
	bottom:0; }
body.editor-styles-wrapper::before,
body.editor-styles-wrapper::after {
	display:none !important; }

/* popup overlay */
body.popup_active {}
	body.popup_active::before {
		background:rgb(var(--colour_background_overlay));
		opacity:1; }

/* loading overlay */
body:not(.ajrdesign_ready, .editor-styles-wrapper),
body.ajrdesign_loading {}
	body:not(.ajrdesign_ready, .editor-styles-wrapper)::before,
	body.ajrdesign_loading::before {
		background:rgb(var(--colour_background_loading));
		cursor:wait; }
	body:not(.ajrdesign_ready, .editor-styles-wrapper)::after,
	body.ajrdesign_loading::after {
		content:'';
		position:fixed;
		left:50%;
		top:45%;
		z-index:9999;
		display:block;
		width:var(--loading_size);
		height:var(--loading_size);
		background:var(--loading_url) no-repeat center;
		background-size:contain;
		opacity:1;
		transform:translate(-50%,-50%);
		pointer-events:none; }


/* --------------------------------------------------------------------------------------------- */
/* BODY LOADING
/* --------------------------------------------------------------------------------------------- */
body:not(.ajrdesign_ready),
body.ajrdesign_loading {
	opacity: 1 !important;
	/*overflow: hidden !important;*/
	cursor: wait !important; }

	.ajrdesign_loader {
            position:fixed;
            z-index:999999999;
            top:0;
            bottom:0;
            left:0;
            right:0;
            display:-webkit-flex; display:flex;
            -webkit-flex-direction:column; flex-direction:column;
            -webkit-justify-content:center; justify-content:center;
            -webkit-align-items:center; align-items:center;
            font-size:0.9em;
            background:#fff;
            opacity:1;
            -webkit-transition:z-index none, opacity 0.3s ease; transition:z-index none, opacity 0.3s ease; }
	body.ajrdesign_ready .ajrdesign_loader {
            z-index:-999999999;
            opacity:0 !important;
            -webkit-transition:opacity var(--transition_active), z-index ease 0.3s; transition:opacity var(--transition_active), z-index ease 0.3s; }

            .ajrdesign_loader::before {
                content:'';
                position:absolute;
                z-index:-1;
                top:51.25%;
                left:49%;
                transform:translate(-50%, -50%);
                line-height:1em;
                font-family:var(--font_heading), Exo;
                font-size:15vw;
                font-weight:900;
                letter-spacing:0;
                opacity:0.015; }

            .ajrdesign_loader svg {
                order:1;
                margin-bottom:1em; }
                .ajrdesign_loader svg circle {
                    fill:none;
                    stroke:rgb(var(--colour_accent));
                    stroke-width:2;
                    transform:rotate(-90deg);
                    transform-origin:center; }
                .ajrdesign_loader svg circle#one,
                .ajrdesign_loader svg circle#three {
                    opacity:0.1; }
                .ajrdesign_loader svg circle#two {
                    opacity:1;
                    stroke-dasharray:6 12;
                    animation: loader-cw 3s cubic-bezier(0.5,0,0.5,1) alternate infinite; }
                .ajrdesign_loader svg circle#four {
                    opacity:1;
                    stroke-dasharray:15 15;
                    animation: loader-acw 2s cubic-bezier(0.6,0,0.4,1) 0.5s alternate infinite; }
                @keyframes loader-cw {
                    0%,3%    { transform:rotate(-90deg); }
                    97%,100% { transform:rotate(720deg); }
                }
                @keyframes loader-acw {
                    0%,3%    { transform:rotate(-90deg); }
                    97%,100% { transform:rotate(-900deg); }
                }

            /* logo */
            .ajrdesign_loader img {
                order:1;
                width:auto;
                height:2.5rem;
                margin-bottom:0.5em; }
                .ajrdesign_loader.logo img {
                    margin:0.5em 0 1em; }

            /* loading info */
            .ajrdesign_loader div {
                order:2;
                line-height:1em;
                /*font-size:0.9em;*/ }
                .ajrdesign_loader div::before {
                    content:'Loading...';
                    padding:0.1rem;
                    font-size:0.8em;
                    font-weight:300;
                    letter-spacing:0.05em;
                    color:rgb(var(--colour_grey_lighterer)); }
                .ajrdesign_loader div::after {
                    content:'';
                    padding:0.1rem;
                    color:rgb(var(--colour_grey_dark));
                    text-transform:uppercase; }

            /* loading messages */
            .home .ajrdesign_loader div::after {
                content:'Homepage'; }


/* --------------------------------------------------------------------------------------------- */
/* STOP HIGHLIGHTING
/* --------------------------------------------------------------------------------------------- */
[readonly],
[disabled],
.noselect {
    -webkit-touch-callout:none; /* iOS Safari */
      -webkit-user-select:none; /* Safari */
       -khtml-user-select:none; /* Konqueror HTML */
         -moz-user-select:none; /* Old versions of Firefox */
          -ms-user-select:none; /* Internet Explorer/Edge */
              user-select:none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
    pointer-events:none;
}


/* --------------------------------------------------------------------------------------------- */
/* HTML DEFAULTS
/* --------------------------------------------------------------------------------------------- */
html {
    scroll-behavior:smooth; }

:focus-visible {
    outline:none; }

/* font-weight */
.font_100 { font-weight: 100; }
.font_200 { font-weight: 300; }
.font_300 { font-weight: 300; }
.font_400 { font-weight: 400; }
.font_500 { font-weight: 500; }
.font_600 { font-weight: 600; }
.font_700 { font-weight: 700; }
.font_900 { font-weight: 900; }

/* font-weight - bold */
.bold_initial {
    font-weight: initial !important; }
.strong, b, .bold {
    font-weight: bold; }
.stronger, .bolder {
    font-weight: bolder; }
.strong_500, .bold_500 {
    font-weight: 500; }
pre strong, pre b,
strong, b,
.strong_600, .bold_600 {
    font-weight: 600; }
.strong_700, .bold_700 {
    font-weight: 700; }

/* ellipsis */
.ellipsis {
    white-space: nowrap !important;
    overflow-x: hidden !important;
    text-overflow: ellipsis !important; }

/* figures/images */
figcaption {
    font-size:0.8em;
    text-align:center;
    color:rgb(var(--colour_grey_light)); }

/* blockquote */
blockquote {
    position:relative;
    margin:1rem 0;
    padding:1.5rem 1.5rem 1.5rem 2rem;
    border-left:2px solid rgb(var(--colour_accent));
    background:rgb(var(--colour_grey_lightest));
    overflow:hidden; }
    blockquote::before {
        content:'\f10d';
        font-family:var(--icons_font_family);
        position:absolute;
        z-index:1;
        right:0.5rem;
        bottom:0.5rem;
        font-size:5rem;
        line-height:0.9em;
        font-weight:900;
        color:rgba(var(--colour_grey),0.05) !important; }
    blockquote p {
        position:relative;
        z-index:2;
        margin-bottom:1rem;
        font-weight:500; }
    blockquote cite {
        position:relative;
        z-index:2;
        display:block;
        margin-top:-0.5rem;
        line-height:1em;
        font-size:0.8em;
        font-weight:300;
        color:rgb(var(--colour_grey_light)); }
        blockquote cite::before {
            content:': '; }

/* pre */
pre {
    align-self:start;
    min-width:300px;
    padding:1em;
    line-height:1.25em !important;
    font-size:0.65rem !important;
    letter-spacing:-0.025em;
    text-align:left;
    overflow-x:auto; }
    pre.no_margin {
        margin:0; }
    pre.no_margin_bottom {
        margin-bottom:0; }
    pre.pre_warning {
            max-height:0;
            margin-top:0;
            padding:0;
            border-radius:10px;
            border:none;
            background:transparent;
            overflow:hidden; }
            pre.pre_warning.show {
                    max-height:2000px;
                    margin-top:1rem;
                    padding:1.25rem 1.5rem;
                    border:1px solid rgb(var(--colour_warning),0.1);
                    background:rgb(var(--colour_warning),0.1); }
            pre.pre_warning::before {
                    position:absolute;
                    top:0;
                    right:10vw;
                    content:attr(content);
                    padding:0.25em 1em;
                    color:#fff;
                    text-shadow:var(--text_shadow) !important;
                    border-radius:5px;
                    background:rgb(var(--colour_warning));
                    cursor:pointer; }
                    pre.pre_warning:hover::before {
                            background:rgb(var(--colour_warning_hover)); }
                    pre.pre_warning:active::before {
                            background:rgb(var(--colour_warning_active)); }
            pre.pre_warning strong {
                    color:rgb(var(--colour_warning)); }

p {}
/* p after heading */
h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p {
	margin-top: var(--margin_small) !important; }

span {
    font-size: inherit; }

a {
    cursor: pointer; }
a:not([type="button"],.container_boxed),
a:focus {
    box-shadow: none !important; }

sup {
	line-height:1em;
	font-size:0.7em;
	text-transform:lowercase !important; }

hr {
	height:auto;
	margin:var(--margin) 0 calc(var(--margin) - 0.5rem);
	line-height:1;
	text-align:center;
	border:none;
	background:none!important; }
	hr::before {
		content:'···';
		padding-left:2em;
		font-family:serif;
		font-size:1.5em;
		letter-spacing:2em;
		color:initial;
		opacity:0.25; }

img {
    vertical-align:middle;
	-webkit-align-self:center; align-self:center; }

/* print_only */
.print_only {
	display:none !important; }

.divider {
	padding:0 var(--flex_gap_small);
	color:rgb(var(--colour_grey_lighterer)); }

/* symbols */
.percentage {
    padding: 0 0 0 0.15em; }

/* lists */
main ol, main ul,
.block-editor ol, .block-editor ul {
	padding-inline-start:2em !important;
	padding-inline-end:1em !important; }
	main li,
	.wrap li,
	.block-editor li {
		position:relative;
		margin-top:var(--margin_xtiny) !important;
		line-height:calc(var(--line_height_default) * 0.9); }
		li::marker {
			color:rgb(var(--colour_accent_light)) !important; }
ul:first-child,
li:first-child {
	margin-top:0 !important; }
ul:last-child,
li:last-child {
	margin-bottom:0 !important; }

ol {
	list-style:none !important;
	counter-reset: ajrdesign-counter; }
	ol li {
		counter-increment: ajrdesign-counter; }
		ol li::marker {}
		ol li::before {
			content: counter(ajrdesign-counter)'.';
			position:absolute;
			left:-1.5em;
			font-size:0.9em;
			color:rgb(var(--colour_accent_light)) }

/* lists after heading */
h3 + ul, h3 + ol,
h4 + ul, h4 + ol,
h5 + ul, h5 + ol,
h6 + ul, h6 + ol { margin-top:var(--margin_xtiny) !important; }
p + ul, p + ol { margin-top:var(--margin_small) !important; }
/*form h3 + ul, form h3 + ol,
form h4 + ul, form h4 + ol,
form h5 + ul, form h5 + ol,
form h6 + ul, form h6 + ol { margin-top:0 !important; }
form p + ul, form p + ol { margin-top:-0.5em !important; }*/

/* captions */
.wp-block-image figcaption {
	margin-bottom:0;
	line-height:1em; }

/* small */
small {
	/*display: inline-block;*/
    font-family: var(--font_secondary);
    padding-right: 4px;
    font-size: 0.8em;
    font-weight: 300;
	color: rgb(var(--colour_grey_light)); }

/* label */
label {
	font-size: 0.9em;
	color: rgb(var(--colour_grey));
	font-weight: 400; }

/* inputs */
input,
textarea,
[type=button],
[type=submit],
select {
    margin:0;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important; }

input:not([type="range"],[type="submit"]),
select, .wp-core-ui select,
textarea,
body:not(.wp-admin) [contenteditable], .application_information [contenteditable] {
    line-height: var(--line_height_input);
    font-size: var(--font_size_input);
    font-weight:var(--font_weight_input);
    text-transform:var(--text_transform_input);
    letter-spacing:var(--letter_spacing_input);
    color:rgb(var(--colour_input));
    border:1px solid rgb(var(--colour_grey_lightererer));
    border-radius:var(--border_radius_input); 
    background:#fff;
    outline:none;
    -webkit-transition:border-color var(--transition); transition:border-color var(--transition); }
body:not(.wp-admin) input:not([type="range"],[type="submit"]),
body:not(.wp-admin) select, body:not(.wp-admin) .wp-core-ui select
body:not(.wp-admin) textarea,
body:not(.wp-admin) [contenteditable], .application_information [contenteditable] {
    font-family:var(--font_type_input) !important; }
textarea {
    font-family:var(--font_type_input) !important;
}
    input:not([type="range"],[type="submit"]):hover,
    select:hover, .wp-core-ui select:hover,
    textarea:hover,
    body:not(.wp-admin) [contenteditable]:hover, .application_information [contenteditable]:hover {
        border-color:rgb(var(--colour_grey_lighterer));
        -webkit-transition: border-color var(--transition_hover); transition: border-color var(--transition_hover); }
    input:not([type="range"],[type="submit"]):focus,
    select:focus, .wp-core-ui select:focus,
    textarea:focus,
    body:not(.wp-admin) [contenteditable]:focus, .application_information [contenteditable]:focus {
        border-color:rgb(var(--colour_grey_lighter));
        box-shadow:0 0 10px -2px rgb(var(--colour_grey_light));
        -webkit-transition: border-color var(--transition_active); transition: border-color var(--transition_active); }

input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week] {
    padding:0 1em;
    line-height:var(--line_height_input);
    min-height:var(--height_input); }
input[type="date"] {
    cursor: text; }
    input::-webkit-calendar-picker-indicator {
        cursor: pointer; }
input[type=checkbox] {
    padding:initial !important;
    box-shadow:none !important; }
input[type=radio] {
    position: absolute;
    z-index: 1;
    opacity: 1;
    width: var(--height_input);
    height: var(--height_input);
    padding: initial !important;
    /*border: 1px solid transparent;*/
    border-radius: 50%;
    box-shadow: none !important;
    cursor: pointer; }
    input[type=radio]:hover {
        border: 2px solid rgba(var(--colour_accent),0.5); }
    input[type=radio]:checked {
        border: 4px solid rgb(var(--colour_accent)) !important; }
    input[type=radio] + label {
        padding-left: calc(var(--height_input) + 1em);
        line-height: var(--height_input); }
    input[type=radio] + label::before,
    input[type=radio] + label::after {
        content: none; }
    .form_item_option {
        position: relative; }
    .form_item_option:not(:last-child) {
        margin-right: 2em; }
        .form_item_option input[type=radio] + label {
            height: var(--height_input);
            color: rgb(var(--colour_text)); }
        .form_item_option.label_over input[type=radio] + label {
            position: relative;
            z-index: 1;
            width: var(--height_input) !important;
            padding-left: 0 !important;
            /*font-size:0.65em !important;*/
            text-align: center; }

	/* radio buttons */
	.form_item .radio_options {
		--this_margin:calc(-1 * var(--form_spacing));
		display:-webkit-flex; display:flex;
		flex-wrap:-webkit-wrap; flex-wrap:wrap;
		width:100%;
		margin:var(--this_margin) 0 0 var(--this_margin); }
		.form_item .radio_options label {
			width:calc(100% / var(--qty)); }
			.form_item .radio_options input[type=radio] {
				display:none; }
			.form_item .radio_options .options_label {
				margin:var(--form_spacing) 0 0 var(--form_spacing);
				padding:var(--padding_button);
				line-height:var(--line_height_button);
				font-size:1em !important;
				font-weight:var(--font_weight_button) !important;
				text-align:center;
				text-transform:var(--text_transform_button);
				letter-spacing:var(--letter_spacing_button);
				color:rgb(var(--colour_text)) !important;
				text-decoration:none !important;
				border-radius:var(--border_radius_input);
				border:1px solid rgb(var(--colour_grey_lightererer));
				background:rgb(var(--colour_grey_lighterererer)) !important;
				cursor:pointer; }
			.form_item .radio_options .options_label:hover {
				color:rgb(var(--colour_accent_hover));
				border-color:rgb(var(--colour_accent));/*
				background:rgb(var(--colour_button)) !important;*/ }
				.form_item .radio_options input[type=radio]:checked + .options_label {
					color:#fff !important;
					background: rgb(var(--colour_button)) !important;
					text-shadow:var(--text_shadow); }

textarea,
body:not(.wp-admin) [contenteditable], .application_information [contenteditable] {
	display:block;
	min-height:var(--height_textarea);
	padding:0.5em 1em;
	line-height:var(--line_height_textarea);
	resize:vertical; }
body:not(.wp-admin) [contenteditable], .application_information [contenteditable] {
	min-height:32px; }
	body:not(.wp-admin) [contenteditable] p, .application_information [contenteditable] p {
		margin:1em 0 0;
		font-size:inherit;
		line-height:inherit; }
		body:not(.wp-admin) [contenteditable] p:first-child, .application_information [contenteditable] p:first-child  {
			margin-top:0; }

select, .wp-core-ui select {
	min-height:var(--height_input);
	padding:0 2.5em 0 1em !important;
	line-height:var(--line_height_input) !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75em center !important;
    background-size:1em !important; }/*calc(1em - 4px)*/
select, .wp-core-ui select,
select option, .wp-core-ui select option {
	cursor:pointer; }
select option, .wp-core-ui select option {
	font-size:0.9em; }

select,
.wp-core-ui select {
	/*border-color:rgb(var(--colour_grey_lighterer));*/ }
	select:hover,
	.wp-core-ui select:hover {
		/*border-color:rgb(var(--colour_grey_light));*/
		color:inherit; }
	select:focus,
	.wp-core-ui select:focus {
		/*border-color:rgb(var(--colour_grey));*/
		box-shadow:none; }
	select.please_select,
	.wp-core-ui select.please_select {
		/*font-size:0.8rem;
		font-weight:300;*/
		color:rgb(var(--colour_grey_lighter)) !important; }
	select.please_select option,
	.wp-core-ui select.please_select option {
		color:rgb(var(--colour_text)) !important; }


/* --------------------------------------------------------------------------------------------- */
/* CHECKBOX SLIDE SWITCH
/* --------------------------------------------------------------------------------------------- */
.switch_container {
    display: -webkit-flex; display: flex; }

/* switch */
label.switch {
	--toggle_size: 27px;
    --toggle_button_margin: 2px;
    position:relative;
	display: -webkit-flex; display: flex;
	height: var(--toggle_size) !important;
	width: calc(var(--toggle_size) * 2) !important;
	margin: 0 !important;
	padding: 0 !important; }
	label.switch input {
		position: absolute;
        display: none; }

	/* button */
    .slider {
		display: -webkit-flex; display: flex;
        width: calc(var(--toggle_size) * 2);
		background-color: rgb(var(--colour_grey_lightest));
		cursor: pointer;
		transition: 0.4s cubic-bezier(0.7, 0.2, 0.3, 0.8); }
		.slider::before {
			content: '';
			display: -webkit-flex; display: flex;
            height: calc(var(--toggle_size) - (var(--toggle_button_margin) * 2));
			width: calc(var(--toggle_size) - (var(--toggle_button_margin) * 2));
			margin: var(--toggle_button_margin);
            background-color: #fff;
			transition: 0.4s cubic-bezier(0.7, 0.2, 0.3, 0.8); }
		label.switch input[readonly] + .slider,
		label.switch input[disabled] + .slider {
			pointer-events: none; }
	
        /* round */
        .slider.round {
            border-radius: var(--toggle_size);
            box-shadow: inset 0 0 5px 0 rgba(0,0,0,0.25);
            overflow: hidden; }
            .slider.round::before {
                border-radius: 50%;
                box-shadow: 0px 1px 5px 0 rgba(0,0,0,0.5); }

    /* checked */
    input:checked + .slider {
		background-color: rgb(var(--colour_success)) !important; }
		input:checked + .slider::before {
			margin-left: calc(var(--toggle_size) + var(--toggle_button_margin)) !important; }


/* --------------------------------------------------------------------------------------------- */
/* READONLY / DISABLED
/* --------------------------------------------------------------------------------------------- */
[readonly],
.readonly,
[disabled],
.disabled {
    text-shadow: none !important;
    opacity: 0.5;
    cursor: not-allowed; }
[disabled],
.disabled {
    cursor:not-allowed !important;
    pointer-events:none; }

    a.tooltip[readonly],
    .readonly {
        opacity:1 !important; }

/* --------------------------------------------------------------------------------------------- */
/* STYLE
/* --------------------------------------------------------------------------------------------- */
.uppercase {
	text-transform:uppercase !important; }


/* --------------------------------------------------------------------------------------------- */
/* COLOURS
/* --------------------------------------------------------------------------------------------- */
.colour_faint { color: rgb(var(--colour_grey_light)) !important; }
.colour_text { color: rgb(var(--colour_text)) !important; }
.colour_accent:not(a[type=button],button,.ajr-button)  { color: rgb(var(--colour_accent)) !important; }
.colour_error:not(a[type=button],button,.ajr-button)   { color: rgb(var(--colour_error)) !important; }
.colour_success:not(a[type=button],button,.ajr-button) { color: rgb(var(--colour_success)) !important; }
.colour_warning:not(a[type=button],button,.ajr-button) { color: rgb(var(--colour_warning)) !important; }
.colour_saving:not(a[type=button],button,.ajr-button)  { color: rgb(var(--colour_grey_light)) !important; opacity:0.5 !important; }
.colour_negative { color: rgb(var(--colour_negative)) !important; }

a[type=button].colour_accent, button.colour_accent, .ajr-button.colour_accent                           { color: #fff !important; background: rgb(var(--colour_accent)) !important; }
a[type=button].colour_accent:hover, button.colour_accent:hover, .ajr-button.colour_accent:hover         { color: #fff !important; background: rgb(var(--colour_accent_hover)) !important; }
a[type=button].colour_accent:active, button.colour_accent:active, .ajr-button.colour_accent:active      { color: #fff !important; background: rgb(var(--colour_accent_active)) !important; }

a[type=button].colour_error, button.colour_error, .ajr-button.colour_error                              { background: rgb(var(--colour_error)) !important; }
a[type=button].colour_error:hover, button.colour_error:hover, .ajr-button.colour_error:hover            { background: rgb(var(--colour_error_hover)) !important; }
a[type=button].colour_error:active, button.colour_error:active, .ajr-button.colour_error:active         { background: rgb(var(--colour_error_active)) !important; }

a[type=button].colour_success, button.colour_success, .ajr-button.colour_success                        { background: rgb(var(--colour_success)) !important; }
a[type=button].colour_success:hover, button.colour_success:hover, .ajr-button.colour_success:hover      { background: rgb(var(--colour_success_hover)) !important; }
a[type=button].colour_success:active, button.colour_success:active, .ajr-button.colour_success:active   { background: rgb(var(--colour_success_active)) !important; }

a[type=button].colour_warning, button.colour_warning, .ajr-button.colour_warning                        { background: rgb(var(--colour_warning)) !important; }
a[type=button].colour_warning:hover, button.colour_warning:hover, .ajr-button.colour_warning:hover      { background: rgb(var(--colour_warning_hover)) !important; }
a[type=button].colour_warning:active, button.colour_warning:active, .ajr-button.colour_warning:active   { background: rgb(var(--colour_warning_active)) !important; }

i.dashicons {
    --dashicon_size: 20px;
    height: var(--dashicon_size);
    width: var(--dashicon_size);
    font-size: var(--dashicon_size); }

i.dashicons-saved:not(.ignore_colour),
i.dashicons-yes:not(.ignore_colour),
i.dashicons-yes-alt:not(.ignore_colour),
i.fa-check:not(.ignore_colour),
i.fa-check-circle:not(.ignore_colour) {
    color: rgb(var(--colour_success));
}

i.dashicons-no-alt:not(.ignore_colour),
i.dashicons-dismiss:not(.ignore_colour),
i.fa-times:not(.ignore_colour),
i.fa-times-circle:not(.ignore_colour) {
    color: rgb(var(--colour_warning));
}

i.fa-bug:not(.ignore_colour), .racecard_data .loading i.fa-bug {
    color: rgb(var(--colour_orange)) !important;
}

.edit_button { color:rgb(var(--colour_grey_lighter)); }
    .edit_button:hover { color:rgb(var(--colour_accent_hover)); }
    .edit_button:active { color:rgb(var(--colour_accent_active)); }


/* --------------------------------------------------------------------------------------------- */
/* HIGHLIGHT - overide wp default
/* --------------------------------------------------------------------------------------------- */
.highlight {
	background-color:inherit;
	color:inherit; }


/* --------------------------------------------------------------------------------------------- */
/* INDICATORS
/* --------------------------------------------------------------------------------------------- */
.indicator_saving, .indicator_success, .indicator_failed {
    position:absolute; }
.indicator_saving {  }
.indicator_success {  }
.indicator_failed {  }


/* --------------------------------------------------------------------------------------------- */
/* FLEX - ORDER 
/* --------------------------------------------------------------------------------------------- */
.order_header { order:-1000 !important; }
.order_footer { order:1000 !important; }
.order_new { order:-900 !important; }
.order_-100 { order:-100 !important; }
.order_-5 { order:-5 !important; }
.order_-4 { order:-4 !important; }
.order_-3 { order:-3 !important; }
.order_-2 { order:-2 !important; }
.order_-1 { order:-1 !important; }
.order_1 { order:1 !important; }
.order_2 { order:2 !important; }
.order_3 { order:3 !important; }
.order_4 { order:4 !important; }
.order_5 { order:5 !important; }
.order_100 { order:100 !important; }
.order_top_2.order_-5 { order:-955 !important; }
.order_top_2.order_-4 { order:-954 !important; }
.order_top_2.order_-3 { order:-953 !important; }
.order_top_2.order_-2 { order:-952 !important; }
.order_top_2.order_-1 { order:-951 !important; }
.order_top_2 { order:-950 !important; }
.order_top { order:-999 !important; }
.order_bottom { order:999 !important; }


/* --------------------------------------------------------------------------------------------- */
/* MARGINS
/* --------------------------------------------------------------------------------------------- */
.margin_none {
	margin:0 !important; }
.margin_auto {
	margin:auto !important; }
.margin_height_none {
	margin:0 auto !important; }
.margin_height_auto {
	margin-top:auto !important;
	margin-bottom:auto !important; }
.margin_width_auto {
	margin-left:auto !important;
	margin-right:auto !important; }
.margin_left_auto {
	margin-left:auto !important;
	margin-right:0 !important; }
.margin_right_auto {
	margin-right:auto !important;
	margin-left:0 !important; }
.margin_top_none {
	margin-top:0 !important; }
.margin_bottom_none {
	margin-top:0 !important; }


/* ---------------------------------------------------------------------
BUTTONS
--------------------------------------------------------------------- */
body:not(.wp-admin) [type=submit] {
    padding:0.75em 1.5em; }

.wp-block-buttons {
    gap:var(--flex_gap_small) !important; }

    /*[type=button],
    [type=submit],
    button,*/
    .wp-block-button__link {
        padding:var(--padding_button);
        line-height:var(--line_height_button);
        font-size:var(--font_size_button) !important;/*--wp--preset--font-size--small*/
        font-weight:var(--font_weight_button) !important;
        color:#fff !important;
        text-transform:var(--text_transform_button);
        letter-spacing:var(--letter_spacing_button);
        text-shadow:var(--text_shadow);
        border:var(--border_button) !important;
        border-radius:var(--border_radius_button) !important;
        background:rgb(var(--colour_button)) !important;
        cursor:pointer; }
        /*[type=button]:hover,
        [type=submit]:hover,
        button:hover,*/
        .wp-block-button__link:hover {
            background:rgb(var(--colour_button_hover)) !important; }
        /*[type=button]:active,
        [type=submit]:active,
        button:active,*/
        .wp-block-button__link:active {
            background:rgb(var(--colour_button_active)) !important; }

    /*[type=button][disabled],
    [type=submit][disabled],
    button[disabled],*/
    .ajr-button.disabled,
    button.disabled,
    .wp-block-button__link[disabled] {
        border-color:rgb(var(--colour_grey_lighter)) !important;
        background:rgb(var(--colour_grey_lighterer)) !important; }

/* sizes */
[type=button].button_lg,
[type=submit].button_lg,
[type=reset].button_lg,
button.button_lg {
	/*padding-top:0.65em !important;*/
	font-size:1em !important; }
	/*[type=button].button_lg .button_icon,
	[type=submit].button_lg .button_icon,
	button.button_lg .button_icon {
		top:-1px; }*/
[type=button].button_sm,
[type=submit].button_sm,
[type=reset].button_sm,
button.button_sm {
	padding:0.5em 0.8em 0.4em !important;
	font-size:0.65em !important; }
[type=button].button_xs,
[type=submit].button_xs,
[type=reset].button_xs,
button.button_xs {
	padding:0.5em 1em 0.3em !important;
    font-size:0.55em !important;
	letter-spacing:0 !important; }

/* style */
.uppercase button,
.uppercase [type=button],
.uppercase [type=submit],
button.uppercase,
[type=button].uppercase,
[type=submit].uppercase {
	padding:var(--padding_button_uppercase) !important;
	text-transform:uppercase !important; }

/* icons */
[type=button] .button_icon,
[type=submit] .button_icon,
[type=reset] .button_icon,
button .button_icon {
	margin-right:0.5em;
	font-size:1.1em !important; }
/* icons sizes */
[type=button].button_sm .button_icon, [type=submit].button_sm .button_icon, [type=reset].button_sm .button_icon, button.button_sm .button_icon {
	font-size:0.9em !important; }
	/* empty */
	[type=button] .button_icon:empty,
	[type=submit] .button_icon:empty,
	[type=reset] .button_icon:empty,
	button .button_icon:empty {
		display:none !important; }
	/* left */
	[type=button].left .button_icon,
	[type=submit].left .button_icon,
	[type=reset].left .button_icon,
	button.left .button_icon {
		margin-right:0.5em; }
	/* right */
	[type=button].right,
	[type=submit].right,
	[type=reset].right,
	button.right {
		display:-webkit-flex; display:flex;
		-webkit-flex-direction:row-reverse; flex-direction:row-reverse; }
		[type=button].right .button_icon,
		[type=submit].right .button_icon,
		[type=reset].right .button_icon,
		button.right .button_icon {
			width:1em;
			margin-left:0.5em;
			margin-right:0; }
	/* above */
	[type=button].above,
	[type=submit].above,
	[type=reset].above,
	button.above {
		display:-webkit-flex; display:flex;
		-webkit-flex-direction:column; flex-direction:column;
		-webkit-align-items:center; align-items:center;
		margin-top:1.75em  !important;
		padding:1em 1em 0.5em !important; }
		[type=button].above .button_icon,
		[type=submit].above .button_icon,
		[type=reset].above .button_icon,
		button.above .button_icon {
			position:absolute;
			top:0;
			margin-right:0;
			transform:translateY(-60%); }
			[type=button].above:hover .button_icon,
			[type=submit].above:hover .button_icon,
			[type=reset].above:hover .button_icon,
			button.above:hover .button_icon {
				animation-name:floaty;
				animation-duration:0.25s;
				animation-iteration-count:infinite;
				animation-direction:alternate; }
	/* below */
	[type=button].below,
	[type=submit].below,
	[type=reset].below,
	button.below {
		display:-webkit-flex; display:flex;
		-webkit-flex-direction:column-reverse; flex-direction:column-reverse;
		-webkit-align-items:center; align-items:center; }
		[type=button].below .button_icon,
		[type=submit].below .button_icon,
		[type=reset].below .button_icon,
		button.below .button_icon {
			position:relative;
			margin:1em 0 0;
			font-size:1.5em;
			animation-name:up-n-down;
			animation-duration:0.5s;
			animation-iteration-count:infinite;
			animation-direction:alternate; }

	/* i */
	[type=button] .button_icon i, [type=submit] .button_icon i, button .button_icon i {
		position:relative; }
		/* right */
		.right [type=button] .button_icon i, .right [type=submit] .button_icon i, .right button .button_icon i {}

	/* i -colours */
	i.compare_up,
	i.compare_down,
	i.compare_same {
		min-width:7px;
		margin-left:5px; }
	i.compare_up {
		color:rgb(var(--colour_success)); }
	i.compare_down {
		color:rgb(var(--colour_warning)); }
	i.compare_same {
		color:rgb(var(--colour_grey_light)); }
		i.compare_same::before {
			content:'-'; }

/* symbols 
.symbol { font-size: 1em; }
.symbol.infinity { content: '&#8734;'; }*/

/* text */
[type=button] .button_text,
[type=submit] .button_text,
button .button_text {
	position:relative;
	top:0px; }

/* transparent */
[type=button].transparent,
[type=submit].transparent,
button.transparent {
	color:rgb(var(--colour_black)) !important;
	text-shadow:none !important;
	background:none !important; }
	[type=button].transparent:hover,
	[type=submit].transparent:hover,
	button.transparent:hover {
		color:rgb(var(--colour_accent_hover)) !important;
		background:none !important; }

/* highlight */
a.highlight,
button.highlight,
a.active,
button.active,
a.selected,
button.selected {    
    color: #fff;
    text-shadow: var(--text_shadow);
    border-color: rgb(var(--colour_selected)) !important;
	background: rgb(var(--colour_selected)) !important;
    cursor: default !important; }


/* ---------------------------------------------------------------------
INPUT - NUMBER
--------------------------------------------------------------------- */
.no_inner_spin::-webkit-inner-spin-button,
.no_inner_spin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0; }

/* ---------------------------------------------------------------------
PLACEHOLDERS
--------------------------------------------------------------------- */
::-webkit-input-placeholder { /* Edge */
	position:relative !important;
	top:-1px !important;
	line-height:inherit !important;
	font-size:var(--font_size_placeholder);
	font-weight:var(--font_weight_placeholder);
	color:rgb(var(--colour_placeholder)); }
	.dark_inputs :-webkit-input-:placeholder {
		color:rgb(var(--colour_placeholder)) !important; }
	.light_inputs ::-webkit-input-placeholder {
		color:rgb(var(--colour_placeholder)) !important; }

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	position:relative !important;
	top:-1px !important;
	line-height:inherit !important;
	font-size:var(--font_size_placeholder);
	font-weight:var(--font_weight_placeholder);
	color:rgb(var(--colour_placeholder)); }
	.dark_inputs ::-ms-input-placeholder {
		color:rgb(var(--colour_placeholder)) !important; }
	.light_inputs ::-ms-input-placeholder {
		color:rgb(var(--colour_placeholder)) !important; }

::placeholder {
	position:relative !important;
	top:-1px !important;
	line-height:inherit !important;
	font-size:var(--font_size_placeholder);
	font-weight:var(--font_weight_placeholder);
	color:rgb(var(--colour_placeholder)); }
	.dark_inputs ::placeholder {
		color:rgb(var(--colour_placeholder)) !important; }
	.light_inputs ::placeholder {
		color:rgb(var(--colour_placeholder)) !important; }


/* --------------------------------------------------------------------------------------------- */
/* LOADING/SAVING/SUCCESS/FAILED
/* --------------------------------------------------------------------------------------------- */
/* overlay */
.loading_overlay,
.saving_overlay,
.success_overlay,
.failed_overlay {
    position:relative;
    overflow:hidden; }
    .loading_overlay::before,
    .saving_overlay::before,
    .success_overlay::before,
    .failed_overlay::before {
        content:'' !important;
        position:absolute !important;
        z-index: 10 !important;
        top:0 !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;
        width: auto !important;
        padding: 0 !important;
        background:rgba(var(--colour_background_loading)) !important;
        transform: none !important;
        transition:none !important; }
    button.loading_overlay::before,
    button.saving_overlay::before,
    button.success_overlay::before,
    button.failed_overlay::before {
        top:-1px !important;
        left:-1px !important;
        right:-1px !important;
        bottom:-1px !important; }
        .loading_overlay::after,
        .saving_overlay::after,
        .success_overlay::after,
        .failed_overlay::after {
            position:absolute !important;
            z-index: 10 !important;
            top:calc(50% - 0.5em) !important;
            left:calc(50% - 0.5em) !important;
            width:1em !important;
            height:1em !important;
            font:var(--fa-font-solid);
            font-family:var(--icons_fontawesome);
            line-height:1.05em !important;
            font-weight:600 !important;
            color:rgb(var(--colour_accent));
            border:none !important;
            text-shadow:none !important;
            transform-origin: unset !important;
            transition:none !important; }
        .loading_overlay::after,
        .saving_overlay::after {
            content:var(--icons_loading) !important;
            font-size: 1rem;
            -webkit-animation: fa-spin 1.5s infinite linear; animation: fa-spin 1.5s infinite linear; }
        .success_overlay::after {
            content:var(--icons_success) !important;
            margin-left:1px;
            color:rgb(var(--colour_success)) !important; }
        .failed_overlay::after {
            content:var(--icons_failed) !important;
            margin-left:3px;
            color:rgb(var(--colour_warning)) !important; }
    button.loading_overlay,
    button.saving_overlay,
    button.success_overlay,
    button.failed_overlay {
        overflow:visible;
        opacity:1 !important; }
        button.loading_overlay::before,
        button.saving_overlay::before,
        button.success_overlay::before,
        button.failed_overlay::before {
            border-radius:inherit;
            width:auto !important;
            transform:unset !important; }
        button.loading_overlay::after,
        button.saving_overlay::after,
        button.success_overlay::after,
        button.failed_overlay::after {
            right:initial !important;
            height:initial!important;
            width:initial !important;
            border:none !important;
            /*transform:unset !important;*/
            transform-origin:unset !important; }

/* icon */
i.loading,
i.saving,
i.success,
i.failed {
    --i_size:1rem;
	position:relative;
    display:-webkit-inline-flex; display:inline-flex;
    margin:0;
    line-height:1rem;
    font-style:normal !important; }
i.loading,
i.saving {
    color:rgb(var(--colour_grey_lighter)); }
i.success {
    color:rgb(var(--colour_success)); }
i.failed {
    color:rgb(var(--colour_warning)); }
    i.loading:hover,
    i.saving:hover {
        color:rgb(var(--colour_accent_hover)); }
    i.loading::before,
    i.saving::before,
    i.success::before,
    i.failed::before {
        font-family:var(--icons_font_family);
        width: var(--i_size) !important;
        height: var(--i_size) !important;
        line-height: var(--i_size) !important;
		font-size: var(--i_size) !important;
        font-weight: 600 !important; }
    i.loading::before,
    i.saving::before {
        content:var(--icons_loading);
        -webkit-animation: fa-spin 1.5s infinite linear; animation: fa-spin 1.5s infinite linear; }
    i.success::before {
        content:var(--icons_success); }
    i.failed::before {
        content:var(--icons_failed); }


/* --------------------------------------------------------------------------------------------- */
/* ICONS
/* --------------------------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------------------------- */
/* POSITION
/* --------------------------------------------------------------------------------------------- */
.position_static { position:static; }
.position_absolute { position:absolute; }
.position_relative { position:relative; }

/* --------------------------------------------------------------------------------------------- */
/* DISPLAY
/* --------------------------------------------------------------------------------------------- */
.display_block { display:block; }
.display_inline_block { display:inline-block; }
.display_table { display:table; }
	.display_table_header { display:table-header-group; }
	.display_table_footer { display:table-footer-group; }
	.display_table_row { display:table-row; }
	.display_table_cell { display:table-cell; }

/* --------------------------------------------------------------------------------------------- */
/* MARGIN & PADDING
/* --------------------------------------------------------------------------------------------- */
.no_margin { margin:0 !important; }
.no_padding { padding:0 !important; }
.padding_left {
    padding-left:4px !important;
    padding-right:0 !important; }
.padding_left_sm {
    padding-left:2px !important;
    padding-right:0 !important; }
.padding_left_xs {
    padding-left:1px !important;
    padding-right:0 !important; }
.padding_right {
    padding-left:0 !important;
    padding-right:4px !important; }
.padding_right_sm {
    padding-left:0 !important;
    padding-right:2px !important; }
.padding_right_xs {
    padding-left:0 !important;
    padding-right:1px !important; }
.padding_both {
	padding-left:4px !important;
	padding-right:4px !important; }
.padding_both_sm {
	padding-left:2px !important;
	padding-right:2px !important; }
.padding_both_xs {
	padding-left:1px !important;
	padding-right:1px !important; }
.padding_bottom { padding:0 0 4px !important }


/* --------------------------------------------------------------------------------------------- */
/* LINE HEIGHT
/* --------------------------------------------------------------------------------------------- */
.line_height_0_75 { line-height:0.75em; }
.line_height_1 { line-height:1em; }
.line_height_1_25 { line-height:1.25em; }
.line_height_1_5 { line-height:1.5em; }
.line_height_1_75 { line-height:1.75em; }
.line_height_2 { line-height:2em; }

/* --------------------------------------------------------------------------------------------- */
/* FONT SIZE
/* --------------------------------------------------------------------------------------------- */
.font_size_sm { font-size:0.8em !important; }
.font_size_lg { font-size:1.2em !important; }

/* --------------------------------------------------------------------------------------------- */
/* FONT WEIGHT
/* --------------------------------------------------------------------------------------------- */
.font_300 { font-weight:300; }
.font_400 { font-weight:400; }
.font_500 { font-weight:500; }
.font_600 { font-weight:600; }
.font_700 { font-weight:700; }
.font_800 { font-weight:800; }
.font_900 { font-weight:900; }
.font_bold { font-weight:bold; }

/* --------------------------------------------------------------------------------------------- */
/* ALIGNMENT
/* --------------------------------------------------------------------------------------------- */
.align_left { text-align:left; }
.align_center { text-align:center; }
.align_right { text-align:right; }
.align_justify { text-align:justify; }

.ajr-button.align_center,
.ajr-button.align_right { display: -webkit-flex; display: flex; }
.ajr-button.align_right { margin-right: unset !important; }

/* --------------------------------------------------------------------------------------------- */
/* TOOLTIP (basic ::before)
/* --------------------------------------------------------------------------------------------- */
.tooltip {
    position:relative;
    cursor:help; }
    .tooltip::before,
    .tooltip::after {
        position:absolute;
        z-index:999999999;
        transition: transform 0.2s ease-in-out; }
    .tooltip::before {
        content:attr(tooltip);
        z-index:11;
        /*white-space: pre-line;
        max-width:200px;*/
        width:max-content;
        padding:0.6em 0.8em 0.6em;
        line-height:0.9em;
        color:#fff;
        font-size:0.7rem;
        font-weight:300;
        text-transform:none;
        text-shadow:none;
        border-radius:5px;
        background:rgb(var(--colour_accent_active));
        box-shadow:var(--box_shadow); }
        .tooltip.button_warning::before {
            background:rgb(var(--colour_warning)); }
        .tooltip.safety_clicked:not(.loading_overlay)::before {
            content:attr(tooltip2); }
    .tooltip::after {
        content:'';
        z-index:10;
        display:block;
        width:0;
        height:20px; }
    .tooltip.tt_left::after,
    .tooltip.tt_right::after {
        height:0;
        border-top:5px solid transparent;
        border-bottom:5px solid transparent; }

    /* top */
    .tooltip::before,
    .tooltip::after,
    .tooltip.tt_top::before,
    .tooltip.tt_top::after {
        transform:translate(50%, -50%) scale(0); }
        .tooltip.show::before,
        .tooltip.show::after,
        .tooltip.tt_top.show::before,
        .tooltip.tt_top.show::after {
            transform:translate(50%, -50%) scale(1); }
    .tooltip::before,
    .tooltip.tt_top::before {
        bottom:10px;
        right:50%;
        white-space:pre-line;
        transform-origin:bottom center; }
    .tooltip::after,
    .tooltip.tt_top::after {
        bottom:12px;
        right:50%;
        height:0;
        border-top:10px solid rgb(var(--colour_accent_active));
        border-left:10px solid transparent;
        border-right:10px solid transparent;
        transform-origin:top center; }
        .tooltip.button_warning::after,
        .tooltip.tt_top.button_warning::after {
            border-top-color:rgb(var(--colour_warning)); }
        /* button */
        [type="button"].tooltip.tt_top::before {
            bottom:13px; }
        [type="button"].tooltip.tt_top::after {
            bottom:15px; }

        /* top - left */
        .tooltip.tt_top_left::before,
        .tooltip.tt_top_left::after {
            transform:translate(0%, -50%) scale(0); }
            .tooltip.tt_top_left.show::before,
            .tooltip.tt_top_left.show::after {
                transform:translate(0%, -50%) scale(1); }
        .tooltip.tt_top_left::before {
            left:-50%;
            right:auto;
            transform-origin:1rem 125%; }
        .tooltip.tt_top_left::after {
            left:calc(0 - 2px);/* was -50% */
            right:auto;
            transform-origin:calc(90% - 4px) -50%;
            transition:none; }
            .tooltip.tt_top_left.show::after {
                transform-origin:calc(90% - 4px) -50%;
                transition:transform 0.2s ease-in-out 0.1s; }

        /* top - right */
        .tooltip.tt_top_right::before,
        .tooltip.tt_top_right::after {
            transform:translate(0%, -50%) scale(0); }
            .tooltip.tt_top_right.show::before,
            .tooltip.tt_top_right.show::after {
                transform:translate(0%, -50%) scale(1); }
        .tooltip.tt_top_right::before {
            left:auto;
            right:-1rem;
            transform-origin:calc(100% - 1rem) 125%; }
        .tooltip.tt_top_right::after {
            left:auto;
            right:0;
            transform-origin:calc(90% - 4px) -50%;
            transition:none; }
            .tooltip.tt_top_right.show::after {
                transform-origin:calc(90% - 4px) -50%;
                transition:transform 0.2s ease-in-out 0.1s; }

    /* bottom */
    .tooltip.tt_bottom::before,
    .tooltip.tt_bottom::after {
        transform:translate(50%, 50%) scale(0); }
        .tooltip.tt_bottom.show::before,
        .tooltip.tt_bottom.show::after {
            transform:translate(50%, 50%) scale(1); }
    .tooltip.tt_bottom::before,
    .tooltip.tt_bottom_left::before,
    .tooltip.tt_bottom_right::before {
        top:10px;
        bottom:auto;
        right:50%;
        transform-origin:top center; }
    .tooltip.tt_bottom::after,
    .tooltip.tt_bottom_left::after,
    .tooltip.tt_bottom_right::after {
        top:12px;
        bottom:auto;
        right:50%;
        height:0;
        border-top: none;
        border-bottom:10px solid rgb(var(--colour_accent_active));
        border-left:10px solid transparent;
        border-right:10px solid transparent;
        transform-origin:bottom center; }
        .tooltip.tt_left::after,
        .tooltip.tt_right::after {
            height:0;
            border-top:5px solid transparent;
            border-bottom:5px solid transparent; }
            .tooltip.tt_bottom.button_warning::after {
                border-bottom-color:rgb(var(--colour_warning)); }

        /* bottom - left */
        .tooltip.tt_bottom_left::before,
        .tooltip.tt_bottom_left::after {
            transform:translate(0%, 50%) scale(0); }
            .tooltip.tt_bottom_left.show::before,
            .tooltip.tt_bottom_left.show::after {
                transform:translate(0%, 50%) scale(1); }
        .tooltip.tt_bottom_left::before {
            left:-0.5rem;
            right:auto;
            transform-origin:20% -25%; }
        .tooltip.tt_bottom_left::after {
            left:0;
            right:auto;
            transform-origin:calc(90% - 4px) 50%;
            transition:none; }
            .tooltip.tt_bottom_left.show::after {
                transform-origin:calc(90% - 4px) 50%;
                transition:transform 0.2s ease-in-out 0.1s; }

        /* bottom - right */
        .tooltip.tt_bottom_right::before,
        .tooltip.tt_bottom_right::after {
            transform:translate(0%, 50%) scale(0); }
            .tooltip.tt_bottom_right.show::before,
            .tooltip.tt_bottom_right.show::after {
                transform:translate(0%, 50%) scale(1); }
        .tooltip.tt_bottom_right::before {
            left:auto;
            right:-0.5rem;
            transform-origin:90% -25%; }
        .tooltip.tt_bottom_right::after {
            left:auto;
            right:0;
            transform-origin:calc(90% - 4px) 50%;
            transition:none; }
            .tooltip.tt_bottom_right.show::after {
                transform-origin:calc(90% - 4px) 50%;
                transition:transform 0.2s ease-in-out 0.1s; }

    /* left */
    .tooltip.tt_left::before,
    .tooltip.tt_left::after {
        top:50%;
        transform:translate(-100%, -50%) scale(0); }
        .tooltip.tt_left.show::before,
        .tooltip.tt_left.show::after {
            transform: translate(-100%, -50%) scale(1); }
    .tooltip.tt_left::before {
        left:-12px;
        right:auto;
        bottom:auto;
        transform-origin: right center; }
    .tooltip.tt_left::after {
        left:-6px;
        border-right:0;
        border-left:10px solid rgb(var(--colour_accent_active));
        transform-origin:0% center; }
        .tooltip.tt_left.button_warning::after {
            border-left-color:rgb(var(--colour_warning)); }

    /* right */
    .tooltip.tt_right::before,
    .tooltip.tt_right::after {
        top:50%;
        transform:translate(100%, -50%) scale(0); }
        .tooltip.tt_right.show::before,
        .tooltip.tt_right.show::after {
            transform: translate(100%, -50%) scale(1); }
    .tooltip.tt_right::before {
        left:auto;
        right:-12px;
        bottom:auto;
        transform-origin: left center; }
    .tooltip.tt_right::after {
        right:-6px;
        border-left:0;
        border-right:10px solid rgb(var(--colour_accent_active));
        transform-origin:100% center; }
        .tooltip.tt_right.button_warning::after {
            border-right-color:rgb(var(--colour_warning)); }

    /* tooltip HTML */
    #ajr_tooltip,
    .tooltip_html {
        --this_border_radius: 4px;
        position: relative; }
    #ajr_tooltip {
        top: 100vh; }
        /* container */
        #ajr_tooltip,
        .tooltip_html .tt_html {
            --top: 0px;
            --left: 0px;
            --transX: calc(-50% + var(--left));
            position: absolute;
            transform: translate(var(--transX),-100%) scale(0);
            transform-origin: bottom calc(50% - var(--left));
            width: max-content;
            max-height: 0;
            max-width: 350px;
            padding: 0;
            line-height: 1.2em;
            font-size: 0.8rem;
            font-weight: 300;
            letter-spacing: initial;
            color: initial;
            opacity: 0;
            transition: var(--transition_fast); }
        #ajr_tooltip {
            --gap_y: 0.75rem;
            --gap_x: 1rem;
            transform-origin: center bottom; }
        .tooltip_html .tt_html {
            top: 1rem;
            left: 50% !important; }
        .tooltip_html:hover {
            z-index: 99999999; }
            #ajr_tooltip.show,
            .tooltip_html:hover .tt_html.tt_sm {
                max-height: 1000px;
                padding: var(--gap_y) var(--gap_x);
                border-radius: var(--this_border_radius);
                background: rgb(var(--colour_grey_lightest));
                box-shadow: 0 0 15px 0 rgba(0,0,0,0.5);
                opacity: 1;
                cursor: initial; }
            #ajr_tooltip.show {
                z-index: 99999999;
                transform: translate(var(--transX),-100%) scale(1);
                transition: all 0.2s ease-out, top 0s none, z-index 0s ease 0.1s, transform var(--transition_cb_fast); }
            .tooltip_html:hover .tt_html.tt_sm {
                transform: translate(var(--transX),-100%) scale(1);
                top: -5px;
                transition: all 0.2s ease-out, top var(--transition_cb); }
            /* small tooltip */
            .tooltip_html:hover .tt_html.tt_sm {
                padding: 0.5em 0.75em;
                font-size: 0.75rem !important; 
                font-weight: 400; }
            .tooltip_html .tt_html.tt_sm div {}
                .tooltip_html .tt_html.tt_sm div small {
                    padding-right: 2px; }
                .tooltip_html .tt_html.tt_sm div span + small {
                    margin-left: 0.5em; }
        /* after */
        #ajr_tooltip::after,
        .tooltip_html .tt_html.tt_sm::after {
            --transX: calc(-50% - var(--left));
            content:'';
            position:absolute;
            z-index:10;
            bottom:0;
            left: 50%;
            transform: translateX(var(--transX));
            display:block;
            border-top:5px solid rgb(var(--colour_grey_lightest));
            transform-origin:top calc(50% - var(--left));
            border-left:5px solid transparent;
            border-right:5px solid transparent;
            opacity: 0;
            transition: var(--transition_fast); }
            #ajr_tooltip.show::after,
            .tooltip_html:hover .tt_html.tt_sm::after {
                bottom: -4px;
                transform: translateX(var(--transX));
                opacity: 1;
                transition: 0.3s ease; }
        
        /* tooltip content */
        #ajr_tooltip header,
        #ajr_tooltip header + .subheader,
        #ajr_tooltip footer,
        .tooltip_html .tt_html header,
        .tooltip_html .tt_html header + .subheader,
        .tooltip_html .tt_html footer {
            width: calc(100% + (var(--gap_x) * 2));
            padding: var(--gap_y) var(--gap_x);
            text-align: center;
            background: #fff; }
        #ajr_tooltip header,
        .tooltip_html .tt_html header {
            margin: calc(-1 * var(--gap_y)) calc(-1 * var(--gap_x)) var(--gap_y);
            font-size: 1.1em;
            font-weight: bold;
            color: rgb(var(--colour_text));
            border-top-left-radius: var(--this_border_radius);
            border-top-right-radius: var(--this_border_radius); }
            #ajr_tooltip .heading,
            .tooltip_html .heading {
                margin: 0; }
            #ajr_tooltip header span,
            .tooltip_html .tt_html header span {
                font-weight: initial; }
        #ajr_tooltip header + .subheader,
        .tooltip_html .tt_html header + .subheader {
            margin: calc(-1 * var(--gap_y)) calc(-1 * var(--gap_x)) var(--gap_y);
            padding: 0.5rem 1rem;
            background: none; }
        #ajr_tooltip footer,
        .tooltip_html .tt_html footer {
            /*--gap_y: 0.5em;*/
            margin: var(--gap_y) calc(-1 * var(--gap_x)) calc(-1 * var(--gap_y));
            padding: var(--gap_y) var(--gap_x);
            border-bottom-left-radius: var(--this_border_radius);
            border-bottom-right-radius: var(--this_border_radius); }
        
        /* race card */
        .page_race-card .tooltip_html {
            cursor: pointer; }
        .page_race-card #ajr_tooltip {
            padding: 0 0 0.5rem; }
            /* header */
            .page_race-card #ajr_tooltip header {
                width: auto;
                margin: 0;
                padding: 0.5rem 0.75rem 0.35rem; }
                .page_race-card #ajr_tooltip header .heading {
                    margin: 0;
                    font-size: 1.1em;
                    font-weight: normal; }
                .page_race-card #ajr_tooltip header > div {
                    font-family: var(--font_secondary);
                    font-size: 0.8em;
                    font-weight: 400; }
            /* subheader */
            .page_race-card #ajr_tooltip.profile .subheader {
                width: auto;
                margin: 0;
                padding: 0.5rem 0.75rem 0.35rem; }
            .page_race-card #ajr_tooltip.profile header + .subheader {
                display: -webkit-flex; display: flex;
                margin: 0 0 0.75rem; }
                /* div */
                .page_race-card #ajr_tooltip.profile > div {
                    display: -webkit-flex; display: flex;
                    padding: 0.25rem 1rem; }
                /* container */
                .page_race-card #ajr_tooltip .tt_container {
                    display: -webkit-flex; display: flex;
                    -webkit-flex-direction: column; flex-direction: column;
                    -webkit-justify-content: center; justify-content: center;
                    background: #fff; }
                        /* item */
                        .page_race-card #ajr_tooltip .tt_item {
                            display: -webkit-flex; display: flex;
                            -webkit-justify-content: center; justify-content: center;
                            -webkit-justify-content: space-between; justify-content: space-between;
                            -webkit-align-items: baseline; align-items: baseline;
                            padding: 0.5rem 0.75rem;
                            line-height: 1em;
                            font-size: 0.7rem; }
                            .page_race-card #ajr_tooltip .tt_item + .tt_item:not([class*="ratings_colour_"]) {
                                margin-top: 0.25em;
                                box-shadow: var(--box_shadow_divider_concave_top); }
                            .page_race-card #ajr_tooltip .tt_item + .tt_item[class*="ratings_colour_"] {
                                margin-top: 2px; }
                        /* heading */
                        .page_race-card #ajr_tooltip .heading {
                            margin-right: 1em;
                            font-size: 0.9em;
                            font-weight: bold;
                            color: initial;
                            text-transform: capitalize; }
                        /* rating stats */
                        .page_race-card #ajr_tooltip .tt_item .tt_rating_stats {
                            display:-webkit-flex; display:flex; }
                            .page_race-card #ajr_tooltip .tt_rating_stats div.no_runs {
                                color: rgb(var(--colour_grey_light)); }
                            .page_race-card #ajr_tooltip .tt_rating_stats div + div {
                                margin-left: 0.75em; }
                                .page_race-card #ajr_tooltip .tt_rating_stats > div small {
                                    padding-right: 3px;
                                    font-weight: 400;
                                    text-transform: capitalize;
                                    color: rgb(var(--colour_grey)); }
                                .page_race-card #ajr_tooltip .tt_rating_stats > div span {
                                    color: initial; }

    /*.tooltip::before {
            background:rgb(240 210 125); }
    .tooltip::after {
            border-left-color:rgb(240 210 125); }
    .tooltip::before {
            background:rgb(175 210 110); }
    .tooltip::after {
            border-left-color:rgb(175 210 110); }
    .tooltip::before,
    .tooltip::before {
        color:rgb(var(--colour_text));
        font-weight:500; }*/


/* --------------------------------------------------------------------------------------------- */
/* RATING: Stars
/* --------------------------------------------------------------------------------------------- */
.stars {
	display:flex;
	gap:var(--flex_gap_xxtiny); }
	.stars .star {}
	.stars .star.dashicons-star-empty {
		color:rgb(var(--colour_grey_lighterererer)); }
		.stars .star.dashicons-star-empty.hover {
			color:rgb(var(--colour_star)); }
	.stars .star.dashicons-star-filled {
		color:rgb(var(--colour_star)); }


/* ---------------------------------------------------------------------
LAYOUT
--------------------------------------------------------------------- */
.message_bottom {
	margin-top:var(--margin_large) !important; }


/* ---------------------------------------------------------------------
CONTAINERS
--------------------------------------------------------------------- */
.form_container {
	margin:var(--margin) auto var(--margin);
	padding:var(--padding_container);
	border-radius:var(--border_radius_form);
	box-shadow:var(--box_shadow);
	background:#fff; }
	.form_container:empty {
		display:none !important; }

	form.form_container h5 {
		margin-top:0.5em !important;
		padding-top:1em !important;
		border-top:1px solid rgb(var(--colour_grey_lightest));
		text-transform:none !important; }

@media screen and (max-device-width:599px) {
	.form_container {
		margin-left:-1.5rem;
		margin-right:-1.5rem;
		border-radius:0; }

		.form_container .form_header {
			flex-direction:column;
			align-items:center;
			gap:var(--flex_gap_small);
			margin-bottom:1rem; }
			.form_container .form_header .form_info {
				flex-direction:row;
				gap:var(--flex_gap); }
}


/* ---------------------------------------------------------------------
FORMS
--------------------------------------------------------------------- */
form[onclick] { cursor:pointer; }
form.form_container {
	/*--flex_gap:1rem;*/
	position:relative;
	display:flex;
	flex-direction:column;
	gap:var(--flex_gap); }
form.form_container.has_status {
	overflow:hidden; }

	/* header */
	form.form_container .form_header {
		display:flex;
		justify-content:space-between;
		/*align-items:baseline;*/
		gap:var(--flex_gap); }
		form.form_container .form_header .form_heading {
			margin:0 0 var(--gap) !important; }

		form.form_container .form_header .form_info {
			display:flex;
			flex-direction:column;
			gap:var(--flex_gap_tiny);
			font-size:0.9em; }
			form.form_container .form_header .form_info div {
				display:flex;
				justify-content:space-between;
				align-items:baseline;
				line-height:1em; }
				form.form_container .form_header .form_info div small {
					padding-right:0.5em;
					font-weight:300; }
				form.form_container .form_header .form_info div span {
					transition:var(--transition); }
					form.form_container .form_header .form_info div span.changed {
						font-size:1.1em;
						font-weight:bold;
						color:rgb(var(--colour_accent)); }

	/* restrictions */
	form.form_container [readonly] {
		opacity:1; }

	/* multipart */
	form.form_container .multipart_container {
		display:flex;
		flex-direction:column;
		gap:var(--flex_gap); }
	form.form_container div[class^="multipart_container multipart_"],
	form.form_container div[class^="form_item multipart_"] {
		max-height:0;
		margin-top:calc(-1 * var(--flex_gap));
		opacity:0;
		overflow:hidden;
		transition:var(--transition); }
	form.form_container .multipart_container.show,
	form.form_container .form_item.show {
		max-height:10000px;
		margin-top:0;
		opacity:1;
		overflow:visible;
		transition:var(--transition); }

	/* form item */
	form.form_container .form_item,
	form.form_container div[class^="form_item multipart_"].show {
		position:relative;
		z-index:2;
		display:flex;
		flex-direction:column;
		gap:var(--flex_gap_tiny); }
		
		form.form_container .form_item > i,
		form.form_container .form_item .form_info i {
			position:absolute;
			right:1em;
			font-size:initial; }
		form.form_container .form_item > i {
			/*bottom:13px;*/
			/*align-self:end;*/
			/*margin-top:calc(-1 * (var(--flex_gap_tiny) + 28px));*/
			top:calc(var(--flex_gap_tiny) + 2em); }
		form.form_container .form_item .form_info i {
			top:calc(-1 * (var(--flex_gap_tiny) + 28px)); }

		form.form_container .form_item label {
			line-height:1.25em;
			font-size:0.9em;
			color:rgb(var(--colour_grey)); }

		/* required */
		form.form_container .form_item input,
		form.form_container .form_item select,
		form.form_container .form_item textarea {
			transition:border-color var(--transition); }
		form.form_container .form_item .valid_success,
		form.form_container .form_item .valid_success:focus {
			border-color:rgb(var(--colour_success)) !important; }
		form.form_container .form_item .valid_success:focus {
			box-shadow:0 0 10px -2px rgba(var(--colour_success),0.75) !important; }
		form.form_container .form_item .valid_error,
		form.form_container .form_item .valid_error:focus {
			border-color:rgb(var(--colour_warning)) !important; }
		form.form_container .form_item .valid_error:focus {
			box-shadow:0 0 10px -2px rgba(var(--colour_warning),0.75) !important; }
		/*testing required
		form.form_container .form_item input:not(.valid_error)[required],
		form.form_container .form_item select:not(.valid_error)[required],
		form.form_container .form_item textarea:not(.valid_error)[required] {
			 border-color:rgb(var(--colour_blue)) !important;}*/

		/* button options */
		form.form_container .form_item .button_options {
			display:-webkit-flex; display:flex;
			-webkit-justify-content:center; justify-content:center; }
			form.form_container .form_item .button_options button {
				width:calc(50% - 0.25em);
				margin-left:0.5em; }
				form.form_container .form_item .button_options button:first-of-type {
					margin-left:0; }
			form.form_container .form_item .button_options button.not_selected {
				border:transparent !important;
				background:rgb(var(--colour_grey_lighterererer)) !important; }
				form.form_container .form_item .button_options button.not_selected:hover {
					background:rgb(var(--colour_accent)) !important; }
			form.form_container .form_item .button_options button.valid_success {
				border-color:transparent !important;
				background:rgb(var(--colour_accent_active)) !important;
				pointer-events:none; }
				form.form_container .form_item .button_options button.valid_success:focus {
					box-shadow:none !important; }

		/* error message */
		form.form_container .form_item .form_message {
			position:relative;
			z-index:1;
			display:-webkit-flex; display:flex;
			-webkit-align-items:baseline; align-items:baseline;
			max-height:0;
			margin-top:calc( -1 * var(--flex_gap_tiny));
			line-height:1.25em;
			font-size:0.8em;
			opacity:0;
			overflow:hidden;
			transition:var(--transition); }
			form.form_container .form_item .form_message.show {
				max-height:100px;
				margin-top:0;
				opacity:1; }
			form.form_container .form_item .form_message.success {
				color:rgb(var(--colour_success)); }
			form.form_container .form_item .form_message.error {
				color:rgb(var(--colour_warning)); }
				form.form_container .form_item .form_message::before {
					font-family:dashicons;
					padding:0 0.5em 0 0.5em;
					transform:translateY(1px); }
				form.form_container .form_item .form_message.success::before {
					content:'\f12a'; }
				form.form_container .form_item .form_message.error::before {
					content:'\f534'; }

	/* form lists */
	form.form_container .form_list {
		/*margin-bottom:0 !important;*/
		padding-inline-start:2em !important;
		padding-inline-end:1.5em !important;
		font-size:0.9em; }
		form.form_container .form_list li {
			color:rgb(var(--colour_text)); }

	/* form info */
	form.form_container .form_info {
		position:relative;
		margin-top:2px;
		font-size:0.8em;
		line-height:1.5em;
		color:rgb(var(--colour_grey)); }
		form.form_container .form_info.heading {
			font-family:var(--font_heading);
			font-size:var(--font_size_h5);
			color:rgb(var(--colour_accent)); }
		form.form_container .form_info.normal,
		form.form_container .form_info.tandc {
			margin:0;
			font-size:0.9em;
			color:#000; }
		form.form_container .form_item + .form_info {
			margin-top:calc(-1 * var(--flex_gap)); }
		form.form_container .form_info.tandc + .form_info {
			margin-top:var(--margin_small);
			text-align:center; }
		form.form_container .form_info.divider {
			margin-top:0.5em !important;/*var(--margin_small)*/
			padding-top:1em !important;
			border-top:1px solid rgb(var(--colour_grey_lightest)); }
	
	/* submit */
	form.form_container .submit {
		margin-top:var(--flex_gap); }
		form.form_container .form_info + .submit {
			margin-top:0; }
	
	/* form status */
	form.form_container .form_status {
		width:100%;
		margin:1rem 0;
		padding:1.5rem 4rem;
		line-height:1em;
		font-weight:300;
		text-align:center;
		color:#fff;
		text-shadow:1px 1px 3px #000;
		background:rgb(var(--colour_status));
		transform:translateX(calc((2rem + 2rem) * -1)) rotate(-10deg); }
		form.form_container .form_status h4 {
			margin:0.5rem 0 0 !important;
			font-size:1.5em;
			font-weight:500;
			color:#fff !important;
			text-transform:none !important; }
			form.form_container .form_status :first-child {
				margin-top:0 !important; }


/* ---------------------------------------------------------------------
COUNTDOWN TIMER
--------------------------------------------------------------------- */
.countdown_timer {
    max-height: 2rem;
    min-width: 1em;
    font-size: 1em;
    overflow: hidden;
    transition: var(--transition); }
.countdown_timer div,
#betbot_clock .date.countdown div {
    padding-left: 2px; }
    .countdown_timer div span,
    #betbot_clock .date.countdown div span {
        font-size: 1em; }
        .countdown_timer div span + span,
        #betbot_clock .date.countdown div span + span {
            padding-left: 0.25em; }
    .countdown_timer div span small,
    #betbot_clock .date.countdown div span small {
        padding: 0;
        font-size: 0.85em;
        color: inherit;
        opacity: 0.8; }
    .countdown_timer div span small {
        padding: 0 0 0 1px !important; }
    .countdown_timer:empty {
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        opacity: 0 !important; }
    .countdown_timer i.loading {
        --i_size: 0.95em;
        color: rgb(var(--colour_accent)); }


/* ---------------------------------------------------------------------
WP COLOR PICKER
--------------------------------------------------------------------- */
.wp-picker-container {
    width:100%;
	display:-webkit-flex; display:flex;
    -webkit-align-items:flex-start; align-items:flex-start;
	-webkit-flex-wrap:wrap; flex-wrap:wrap;/**/ }

	.wp-picker-container .wp-color-result.button {
		width:120px;
		margin:0;
		padding:0 0 0 var(--height_input);
		border:none;
		border-radius:var(--border_radius_input);
		box-shadow:none;
		overflow:hidden; }
		.wp-picker-container .wp-color-result.button .wp-color-result-text {
			padding:unset;
			line-height:var(--height_input);
			border:none;
			border-radius:0 var(--border_radius_input) var(--border_radius_input) 0; }
		.wp-picker-container .wp-color-result.button .color-alpha {
			width:var(--height_input) !important;
			border-top-left-radius:var(--border_radius_input) !important;
			border-bottom-left-radius:var(--border_radius_input) !important; }

	/* closed */
	.wp-picker-input-wrap {
    	width:calc(100% - 120px - 0.5em);
		display:-webkit-flex; display:flex;
		margin-left:0.5em; }

	/* open */
	.wp-picker-open + .wp-picker-input-wrap {
    	width:calc(100% - 120px - 0.5em);
		display:-webkit-flex; display:flex;
		margin-left:0.5em; }
		.wp-picker-input-wrap label {
			display:inline-block;
			width:auto;
			padding-top:0 !important; }
			.wp-picker-container input[type=text].wp-color-picker {
				width:auto !important;
				padding:0.25em 1em;
				font-family:inherit;
				height:var(--height_input);
				line-height:2;
				text-align:center; }
		.wp-picker-input-wrap .wp-picker-default {
			display:inline-block;
			width:auto !important;
			margin-left:2px !important;
			line-height:1 !important;
			font-size:0.75em !important;
			text-transform:var(--text_transform_button);
			color:inherit;
			box-shadow:none !important; }

	.wp-picker-holder {
		 }
		.wp-picker-container .iris-picker {
			margin:0.5em 0 1em;
			border-radius:0 0 var(--border_radius_input) var(--border_radius_input); }

	.wp-picker-container .wp-color-result.button,
	.wp-picker-input-wrap .wp-picker-default,
	.wp-picker-container .iris-picker {
		border-color:rgb(var(--colour_grey_lightererer)); }
		.wp-picker-container .wp-color-result.button:hover, .wp-picker-container .wp-color-result.button:focus,
		.wp-picker-input-wrap .wp-picker-default:hover, .wp-picker-input-wrap .wp-picker-default:focus,
		.wp-picker-container .iris-picker:hover, .wp-picker-container .iris-picker:focus {
			border-color:rgb(var(--colour_grey_light)); }
			.wp-picker-container .wp-color-result.button:hover .wp-color-result-text, .wp-picker-container .wp-color-result.button:focus .wp-color-result-text {
				background:#fff; }


/* ---------------------------------------------------------------------
GRAPH
--------------------------------------------------------------------- */
.graph_wrapper {
    --graph_height: 350px; }
    .graph {
        --x_padding: inherit;
        --y_padding: inherit;
        --this_radius: inherit;
        --this_background: inherit;
        --this_box_shadow: inherit;
        display: -webkit-flex; display: flex;
        -webkit-flex-direction: column; flex-direction: column;
        -webkit-flex-grow: 1; flex-grow: 1;
        width: 100%;
        font-weight: 500;
        border-radius: var(--this_radius);
        background: var(--this_background);
        box-shadow: var(--this_box_shadow); }
        /* graph_header & graph_footer */
            .graph .graph_header div:not(.graph_row),
            .graph .graph_footer div:not(.graph_row) {
                font-family: var(--font_code);
                font-size: 0.95em; }
            .graph .graph_header div:not(.graph_row) + div,
            .graph .graph_footer div:not(.graph_row) + div {
                margin-left: 1rem; }
                .graph .graph_header div:not(.graph_row) small,
                .graph .graph_footer div:not(.graph_row) small {
                    font-size: 0.9em; }
        /* graph_header */
        .graph .graph_header {
            display: -webkit-flex; display: flex;
            padding: var(--y_padding) var(--x_padding);
            transition: var(--transition);
            cursor: pointer; }
            .graph .graph_header .heading {
                margin: 0 auto 0 0;
                font-family: var(--font_heading);
                font-size: 1.25rem;
                font-weight: lighter;
                text-transform: uppercase; }
            .graph .graph_header .graph_row {
                display: -webkit-flex; display: flex; }
                .graph .graph_header .graph_row div {
                transition: var(--transition); }
                .graph.closed .graph_header .graph_row div {
                    opacity: 0;
                    transition: var(--transition_active); }
                .graph .graph_header .pandl.profit {
                    color: rgb(var(--colour_green)); }
                .graph .graph_header .pandl.loss {
                    color: rgb(var(--colour_red)); }
                .graph .graph_header i.dropdown_arrow {
                    line-height: 1rem;
                    margin-left: 1rem;
                    margin-right: 2px;
                    color: rgb(var(--colour_grey_lighterer));
                    -webkit-transition: var(--transition_cb);
                    transition: var(--transition_cb); }
                .graph.open .graph_header i.dropdown_arrow {
                    color: rgb(var(--colour_accent));
                    transform: rotate(-90deg); }            
        /* graph_footer */
        .graph .graph_footer {
            --this_margin: 0.5rem;
            display: -webkit-flex; display: flex;
            -webkit-flex-wrap: wrap; flex-wrap: wrap;
            -webkit-justify-content: space-evenly; justify-content: space-evenly;
            padding: 0  var(--x_padding) var(--y_padding) var(--x_padding);
            font-size: 0.9em;
            font-weight: normal;
            border-top: 1px solid rgb(var(--colour_grey_lighterererer)); }
        .graph .graph_footer div {
            margin: var(--this_margin) var(--this_margin) 0; }
        /* data_options */
        .graph .data_options {
            max-height: 2000px;
            transition: var(--transition);
            overflow: hidden; }
        .graph.closed .data_options {
            max-height: 0;
            transition: var(--transition_active) !important; }
        /* graph_container */
        .graph .graph_container {
            --container_padding_top: 1.5rem;
            --container_padding_bottom: calc(var(--container_padding_top) / 2);
            position: relative;
            width: 100%;
            height: calc(var(--graph_height) + var(--container_padding_top) + var(--container_padding_bottom));
            padding: var(--container_padding_top) 0 var(--container_padding_bottom);
            background: #fff;
            box-shadow: inset 0 1px 0 rgb(var(--colour_grey_lighterererer));
            overflow: hidden; }
            .graph .graph_container .graph_content {
                display: -webkit-flex; display: flex;
                -webkit-justify-content: space-between; justify-content: space-between;
                -webkit-align-items: flex-end; align-items: flex-end;
                position: relative;
                width: 100%;
                height: var(--graph_height);
                box-shadow: -20px 0px 15px -25px rgba(0,0,0,0.25), 20px 0px 15px -25px rgba(0,0,0,0.25);
                cursor: -webkit-grab; cursor: grab; }
            /* graph_item */
            .graph .graph_container .graph_content .graph_item {
                display: -webkit-flex; display: flex;
                -webkit-justify-content: center; justify-content: center;
                -webkit-align-items: flex-end; align-items: flex-end;
                z-index: 1;
                width: 100%;
                height: var(--graph_height); }
                /* date indicator */
                .graph .graph_container .graph_content .graph_item .date_indicator {
                    position: absolute;
                    z-index: 0;
                    top: 0;
                    bottom: 0;
                    width: 1px;
                    background: var(--colour_graph_date_indicator);
                    cursor: pointer; }
                    .graph .graph_container .graph_content .graph_item .date_indicator div {
                        position: absolute;
                        top: calc(-1 * (var(--container_padding_top) / 2));
                        left: -50%;
                        transform: translate(-50%,-50%);
                        padding: 0 2px;
                        font-family: var(--font_secondary);
                        font-size: 0.7em;
                        font-weight: lighter;
                        letter-spacing: 0;
                        white-space: nowrap;
                        color: var(--colour_graph_date_indicator_marker); }
                    .graph .graph_container .graph_content .graph_item:not(.starting_kitty) .date_indicator div {
                        background: #fff; }
                /* new */
                .graph .graph_container .graph_content .graph_item.new {
                    z-index: 11; }
                    .graph .graph_container .graph_content .graph_item.new .date_indicator {
                        background: var(--colour_graph_date_indicator_new); }
                        .graph .graph_container .graph_content .graph_item.new .date_indicator div {
                            color:var(--colour_grey); }
                /* item_bar */
                .graph .graph_container .graph_content .graph_item .item_bar {
                    position: relative;
                    cursor: pointer; }
                    .graph .graph_container .graph_content .graph_item .item_marker {
                        width: 1px;
                        height: 1px;
                        border-radius: 50%; }
                    .graph .graph_container .graph_content .graph_item .item_indicator {
                        position: absolute;
                        bottom: calc(-1*(var(--container_padding_bottom) / 2));
                        left: -2px;
                        transform: translateY(50%);
                        width: 5px;
                        height: 5px;
                        border-radius: 50%; }
                /* stop_loss */
                .graph .graph_container .graph_content .graph_item .item_stop_loss {
                    position: absolute;
                    z-index: 11;
                    background: var(--colour_graph_stop_loss);
                    cursor: pointer; }
                    .graph .graph_container .graph_content .graph_item .item_stop_loss div {
                        width: 1px;
                        height: 1px;
                        border-radius: 50%;
                        background: var(--colour_graph_stop_loss_marker); }
                /* starting kitty */
                .graph .graph_container .graph_content .graph_item.starting_kitty .date_indicator {}
                    .graph .graph_container .graph_content .graph_item.starting_kitty .date_indicator div {
                        padding-left: 0.5em;
                        padding-right: 0.1em;
                        line-height: 5px;
                        text-transform: uppercase;
                        letter-spacing: 0.025em;
                        color: var(--colour_grey_lightererer);
                        background: #fff;
                        transform: rotate(-90deg) translateX(-90%);
                        transform-origin: left; }
                .graph .graph_container .graph_content .graph_item.starting_kitty .item_bar {
                    height: var(--kitty_height);
                    background: #ccc; }
                    .graph .graph_container .graph_content .graph_item.starting_kitty .item_marker {
                        background: #000; }
                /* starting balance */
                .graph .graph_container .graph_content .starting_balance {
                    position: absolute;
                    z-index: 0;
                    left: 0;
                    right: 0;
                    bottom: calc(var(--kitty_height) - 3px);
                    height: 0;
                    padding: 1px 0;
                    border-top: 1px dashed rgba(0,0,0,0.125);
                    cursor: pointer; }
                    .graph .graph_container .graph_content .starting_balance.profit {
                        bottom: calc(var(--kitty_height) - 1px);
                        height: calc(var(--graph_height) - var(--kitty_height));
                        border-top: none;
                        border-bottom: 1px dashed rgba(0,0,0,0.125);
                        background: rgba(var(--colour_success),0.025); }
                    .graph .graph_container .graph_content .starting_balance.loss {
                        bottom: 0;
                        height: var(--kitty_height);
                        background: rgba(var(--colour_warning),0.025); }


/* ---------------------------------------------------------------------
BROWSER INCOMPATIBILITY FIXES
--------------------------------------------------------------------- */
/* stop mobiles zooming in on form 
@media screen and (-webkit-min-device-pixel-ratio:0) { 
	select,
	textarea,
	input {
		font-size: 16px !important; }
}*/

/*@supports (display:flex) {
	* {
		text-decoration:line-through !important;
	}
}*/

@supports (-webkit-touch-callout:none) and (not (translate:none)) {
	:root {
		--flex_gap_large:2rem;
		--flex_gap:1rem;
		--flex_gap_small:calc(var(--flex_gap) / 2);
		--flex_gap_tiny:calc(var(--flex_gap) / 3);
		--flex_gap_xtiny:calc(var(--flex_gap) / 4); }
	
	/* header */
	.wp-block-navigation__container {}
		.wp-block-navigation__container::before {
			margin-right:var(--flex_gap); }
		.wp-block-navigation__container li:not(:last-child) {
			margin-right:var(--flex_gap); }

	/* admin_features */
	.admin_features a:not(:last-child) {
		margin-right:var(--flex_gap); }

	/* client_breadcrumbs */
	.client_breadcrumbs li:not(:last-child) {
		margin-right:var(--flex_gap_xtiny); }

	/* buttons */
	.wp-block-buttons .wp-block-button a.wp-block-button__link {
		margin:var(--flex_gap_tiny); }

	/* gallery */
	.gallery_item {
		--gap_adjust:calc(var(--flex_gap_small) * var(--items_per_row)) !important;
		--item_width:calc((100% - var(--gap_adjust)) / var(--items_per_row)) !important;
		max-width:var(--item_width);
		margin:var(--flex_gap_xtiny); }
		/*.gallery_item img {
			height:auto;
			max-width:100%; }*/

	/* form */
	form.form_container > *:not(:last-child),
	form.form_container .multipart_container > *:not(:last-child) {
		margin-bottom:var(--flex_gap); }

		/* form header */
		.form_header .form_info > *:not(:last-child) {
			margin-bottom:var(--flex_gap_tiny); }

		/* form profile */
		.form_profile .form_column:first-child {
			margin-right:var(--flex_gap); }
			.form_profile .form_column > *:not(:last-child) {
				margin-bottom:var(--flex_gap_xtiny); }
				.form_profile .form_column .form_item label {
					min-width:100px !important; }
		
		/* form section heading */
		form.form_container .form_section_heading {
			margin-bottom:var(--flex_gap) !important; }

		/* form item */
		form.form_container .form_item {
			 }
			form.form_container .form_item label {
				margin-bottom:var(--flex_gap_xtiny); }
}


/* --------------------------------------------------------------------------------------------- */
/* 3rd PARTY PULGINS
/* --------------------------------------------------------------------------------------------- */
/* user switching */
#user_switching_switch_on {
	position:fixed !important;
	top:0.5em !important;
	left:50% !important;
	bottom:auto !important;
	transform:translateX(-50%) !important;
	padding:0.5em 0.75em 0.4em !important;
	line-height:1em !important;
	font-size:0.7em !important;
	border-radius:5px !important;
	background:rgba(255,255,255,0.5) !important; }