/*
Theme Name: Time to Fix Mental Health - Landing
Theme URI: https://www.inklab.com.au/
Description: Custom website theme with Homepage theme support only.
Version: 1.0
Author: Inklab
Author URI: https://www.inklab.com.au/
*/

html, body {
	margin: 0;
	padding: 0;
	font-size: 20px;
	/*font-size: calc( 20px + (28 - 16) * (100vw - 680px) / (1280 - 680) );*/
	font-size: calc( 20px + 12 * (100vw - 768px) / 768 );
	font-family:"pragmatica-extended";
	font-weight: normal;
	min-width: 320px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

h1, h2, h3, .h3, h4, h5{
	font-family:"pragmatica-extended";
	font-weight: normal;
	line-height: 1.2;
}

h1, h2{
	font-size: 2rem;
	margin: 1rem 0;
}
h3, .h3, h4, h5{
	font-size: 1em;
	margin: 1em 0;
}


/*---------------------------------------------------------Clearfix */
.group{ zoom: 1; position: relative; }
.group::before, .group::after{ content: ''; display: table; clear: both; } 

.unselectable{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

*:focus{ outline: none; }
/**::selection{}
*::-moz-selection{}*/

div, nav, aside, section{ box-sizing: border-box; overflow: visible; }
img{ max-width: 100%; height: auto; box-shadow: #000 0em 0em 0em; border: 0; }
img.alignleft{ display: block; margin-left: 0; margin-right: auto; }
img.alignright{ display: block; margin-left: auto; margin-right: 0; }
img.aligncenter{ display: block; margin-left: auto; margin-right: auto; }
img.block{ display: block; width: 100%; }

table{ width: 100%; }
table.alignright, table.alignleft{ width: auto; }
td, th{ padding: 6px; }

iframe{ width: 100%; max-width: 100%; } 
video{ width: 100%; height: auto; max-width: 100%; }
form input, input[type="submit"], button{ border-radius: 0; -webkit-appearance: none; -webkit-border-radius:0px; }

a{ color: inherit; text-decoration: none; transition: all 0.4s ease 0s; }
a:hover{ transition: all 0.4s ease 0s; }

ul, ol{ margin: 1em 0; }
ul li, ol li{ margin-bottom: 0.4em; }

.text-center{ text-align: center; }
.text-left{ text-align: left; }
.text-right{ text-align: right; }

.text-small{ font-size: 0.66rem; }

.divline{ width: 100%; height: 1px; background: #FF9D6C; margin: 1rem 0; }
.divline.padleft{ width: 95%; height: 1px; background: #FF9D6C; margin: 1rem 0 1rem auto; }

/*--------------------------------------------------------- Wrapper / Inner */
		
.section { width: 100%; margin: 0 auto; padding: 0; clear: both; position: relative; }
.section .inner{ max-width: 1120px; width: 100%; margin: 0 auto; position: relative; }

/*--------------------------------------------------------- Colour profiles */
.bg-white{ background-color: #FFF; }
.bg-yellow{ background-color: #FFCE00; }
.bg-purple{ background-color: #888EDE; }
.bg-green{ background-color: #0DB561; }
.bg-orange{ background-color: #FF9D6C; }
.bg-blue{ background-color: #00587C; }
.bg-beige{ background-color: #CCC7B4; }
.bg-maroon{ background-color: #3D1F29; }

.profile-white{ background-color: #FFF; color: #00587C; }
.profile-yellow{ background-color: #FFCE00; color: #fff; }
.profile-purple_b{ background-color: #888EDE; color: #fff; }
.profile-green_y{ background-color: #0DB561; color: #fff; }
.profile-orange_p, .profile-orange_y{ background-color: #FF9D6C; color: #fff; }
.profile-blue_g{ background-color: #00587C; color: #fff; }
.profile-beige_y{ background-color: #CCC7B4; color: #fff; }
.profile-maroon_g{ background-color: #3D1F29; color: #fff; }


.profile-purple_b a:hover{ color: #00587C; }
.profile-orange_p a:hover{ color: #888EDE; }
.profile-green_y a:hover,
.profile-orange_y a:hover,
.profile-beige_y a:hover{ color: #FFCE00; }
.profile-blue_g a:hover,
.profile-maroon_g a:hover{ color: #0DB561; }

.profile-yellow svg .primary{ fill: #FFCE00; }
.profile-purple_b svg .primary{ fill: #888EDE; }
.profile-green_y svg .primary{ fill: #0DB561; }
.profile-orange_p svg .primary{ fill: #FF9D6C; }
.profile-blue_g svg .primary{ fill: #00587C; }
.profile-beige_y svg .primary{ fill: #CCC7B4; }
.profile-orange_y svg .primary{ fill: #FF9D6C; }
.profile-maroon_g svg .primary{ fill: #3D1F29; }

.profile-purple_b svg .secondary{ fill: #00587C; }
.profile-green_y svg .secondary{ fill: #FFCE00; }
.profile-orange_p svg .secondary{ fill: #888EDE; }
.profile-blue_g svg .secondary{ fill: #0DB561; }
.profile-beige_y svg .secondary{ fill: #FFCE00; }
.profile-orange_y svg .secondary{ fill: #FFCE00; }
.profile-maroon_g svg .secondary{ fill: #0DB561; }

/*--------------------------------------------------------- Flex grid */

.flex-container{
	width: 100%; max-width: 100%; height: 100%; min-height: inherit; position: relative; padding: 0; margin: 0; box-sizing: border-box;
	display: flex; flex-wrap: nowrap; flex-direction: row; overflow: visible;
	align-items: flex-start;  align-content: flex-start;  justify-content: flex-start;
}
	.flex-container.flex-nowrap{ flex-wrap: nowrap!important; }
	.flex-container.flex-wrap{ flex-wrap: wrap; }
	.flex-container.flex-reverse{ flex-direction: row-reverse; }	
	.flex-container.flex-center{ align-items: center; align-content: center; justify-content: center; }
	.flex-container.flex-end{ align-items: flex-end; align-content: flex-end; justify-content: flex-start; }
	.flex-container.flex-stretch{ align-items: stretch; align-content: flex-start; justify-content: stretch; }
	.flex-container.flex-edges{ align-items: flex-start; align-content: space-between; justify-content: space-between; }
	.flex-container.flex-edges-center{ align-items: center; align-content: space-between; justify-content: space-between; }

		/* note IE can't handle left/right padding on flex-item - ignores border-box */
		.flex-container .flex-item{ 
			display: block; flex-basis: auto; flex-grow: 0; flex-shrink: 0; position: relative; overflow: visible;
			box-sizing: border-box; box-shadow: none; text-decoration: none; border: 0px none; margin: 0 0; padding: 0 0; max-width: 100%; 
		}
		.flex-container .flex-item.flex-grow{ flex-grow: 1; }

			.flex-container .flex-item.content_100w{ flex-basis: 100%; width:100%; }
			.flex-container .flex-item.content_75w{ flex-basis: 75%; width: 75%; }
			.flex-container .flex-item.content_50w{ flex-basis: 50%; width: 50%; }
			.flex-container .flex-item.content_33w{ flex-basis: 33.33%; width: 33.33%; }
			.flex-container .flex-item.content_25w{ flex-basis: 25%; width: 25%; }

			.flex-container .flex-item .content.padleft{ padding-left: 5vw; }
			.flex-container .flex-item.content_100w .content{}
			.flex-container .flex-item.content_75w .content{ padding-left: 5vw; }
			.flex-container .flex-item.content_50w .content{ padding-left: 5vw; }

/*------------------------------------------------------ WEBSITE Page styles */
/*-------- HEADER */

#site-header{ position: absolute; top: 0; left: 0; width: 100%; z-index: 100; font-size: 0.66rem; }
#site-header .inner{ max-width: 100%; padding: 0.8rem 1rem; box-sizing: border-box; }
#site-header .inner img{ display: inline-block; vertical-align: middle; }


/*-------- SECTIONS */
section.section_banner{ height: 100vh; }
section.section_banner .inner{ height: 100%; }

section.section_banner h1{ margin: 1rem 0 0 0; }
section.section_banner img.banner-logo{ 
	display: inline-block; vertical-align: middle; 
	max-height: 60vh; height: 60vh; width: auto;
}

section.section_colourband .inner{ padding: 30vh 0; }
section.section_footer_contact .inner{ padding: 15vh 0 8vh 0; }

section.section_footer_contact h3{ margin-bottom: 0; color: #FF9D6C; }
section.section_footer_contact h3 + p{ margin-top: 0; }

.profile-graphic{ z-index: 0; position: absolute; top: -15vh; max-width: 34vw; }
.profile-graphic svg{ z-index: 1; display: block; max-width: 100%; height: auto; overflow: visible; position: relative; }
.profile-graphic svg path{ transition: all 0.4s ease; }

.profile-purple_b .profile-graphic{ right: 2vw; }
.profile-green_y .profile-graphic{ left: -5vw; top: -12vh; }
.profile-orange_p .profile-graphic{ right: 4vw; }
.profile-orange_y .profile-graphic{ left: 2vw; top: -20vh; }
.profile-beige_y .profile-graphic{ right: 2vw; }
.profile-blue_g .profile-graphic{ left: 3vw; }
.profile-maroon_g .profile-graphic{ right: 3vw; }


.profile-graphic span[data-tilt]{ transform-style: preserve-3d; }
.profile-graphic span[data-tilt] svg{ transform-style: preserve-3d; display: block; position: relative; }

/*-------- FOOTER */

ul.social-links{ list-style-type: none; margin: 0; padding: 0; }
ul.social-links li{ display: inline-block; vertical-align: middle; text-align: center; margin: 0 0.4em 0.4em 0; padding: 0; }
ul.social-links li a{ display: block; height: 44px; width: 44px; font-size: 20px; line-height: 46px; background: #FF9D6C; color: #3D1F29; font-weight: bold; border-radius: 50%; }
ul.social-links li a:hover{ background: #0DB561; color: #3D1F29; }

ul.site-footer-nav{ list-style-type: none; margin: 0; padding: 0; }
ul.site-footer-nav li{ display: inline-block; vertical-align: middle; margin: 0 0.4em 0.4em 0.4em; padding: 0; }
ul.site-footer-nav li a{}

.info-box{ border: 1px solid #FF9D6C; display: inline-block; vertical-align: middle; margin-bottom: 1rem; line-height: 1; }
.info-box .info-box-pad{ padding: 1rem 1rem; }
.info-box .info-box-pad p{ margin: 0;}
.info-box .info-box-pad p + p{ padding-top: 1rem; }

a.button_blue{ display: inline-block; vertical-align: middle; padding: 0.4em 0.8em; margin: 0; border: 1px solid #00587C; color: #00587C; background-color: transparent; text-decoration: none; }
a.button_blue:hover{ color: #FFF; background-color: #00587C; text-decoration: none; }

/*-------- FORMS / GFROM */
.gform_wrapper{ font-size: 0.67rem; margin: 1rem 0!important; }
.gform_wrapper .gform_body{ margin: 1rem 0; }

.gform_confirmation_wrapper{ margin: 1rem 0 }


.gform_wrapper input,
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) {
    background: transparent;
    border: 0;
    border-bottom: 2px solid #fff;
    color: #fff;
    padding: 0.5em 2px;
    line-height: 1.2;
}

.gform_wrapper select, .gform_wrapper textarea{
	background: transparent;
    border: 2px solid #fff;
    color: #fff;
    padding: 0.5em 2px;
    line-height: 1.2;
}

.gform_wrapper input[type=submit]{
	background: transparent;
	border: 2px solid #fff;
	color: #fff;
	line-height: 1;
	padding: 0.6em 2.2em;
	transition: all 0.4s ease;
}
.gform_wrapper input[type=submit]:hover{
	cursor: pointer; transition: all 0.4s ease;
}
.profile-purple_b .gform_wrapper input[type=submit]:hover{ color: #00587C; border-color: #00587C; }
.profile-orange_p .gform_wrapper input[type=submit]:hover{ color: #888EDE; border-color: #888EDE; }
.profile-green_y .gform_wrapper input[type=submit]:hover,
.profile-orange_y .gform_wrapper input[type=submit]:hover,
.profile-beige_y .gform_wrapper input[type=submit]:hover{ color: #FFCE00; border-color: #FFCE00; }
.profile-blue_g .gform_wrapper input[type=submit]:hover,
.profile-maroon_g .gform_wrapper input[type=submit]:hover{ color: #0DB561; border-color: #0DB561; }


.gform_wrapper form ::placeholder { color: rgba(255, 255, 255, 0.7);  opacity: 1; }
.gform_wrapper form :-ms-input-placeholder { color: rgba(255, 255, 255, 0.7); }
.gform_wrapper form ::-ms-input-placeholder { color: rgba(255, 255, 255, 0.7); }


/* gform validation */
.gform_wrapper.gform_validation_error .validation_error{
	color: #FF9D6C;
	border: 0;
	text-align: left;
	padding: 0 0;
	margin: 0 0;
	font-size: 0.67em;
}
.gform_wrapper .validation_message,
.gform_wrapper.gform_validation_error div.gfield_description.validation_message{
	color: #FF9D6C;
	font-size: 0.67em;
	padding-top: 6px;
}

.gform_wrapper.gform_validation_error .gform_body ul li.gfield.gfield_error,
.gform_wrapper.gform_validation_error .gform_body ul li.gfield.gfield_error:not(.gf_left_half):not(.gf_right_half){
	border: 0;
    background: none;
    max-width: 100%;
}

.gform_wrapper.gform_validation_error .gform_body ul li.gfield.gfield_error:not(.gf_left_half):not(.gf_right_half) {
    padding-right: 0!important;
    /*margin: 0 0 20px 0!important;*/
    margin: 0 0!important;
    max-width: 100%!important;
}
.gform_wrapper.gform_validation_error li.gfield.gfield_error.gfield_contains_required div.ginput_container, 
.gform_wrapper.gform_validation_error li.gfield.gfield_error.gfield_contains_required label.gfield_label {
    margin-top: 0;
    padding-right: 0;
}

.gform_wrapper.gform_validation_error .gfield.gfield_error input,
.gform_wrapper.gform_validation_error .gfield.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
	padding: 0.5em 2px;
	border: 0;
	border-bottom: 2px solid #FF9D6C;
	margin-bottom: 0;
}
.gform_wrapper.gform_validation_error .gfield.gfield_error textarea,
.gform_wrapper.gform_validation_error .gfield.gfield_error select{
	padding: 0.5em 2px;
	border: 2px solid #FF9D6C;
	margin-bottom: 0;
}
	.gform_wrapper.gform_validation_error .gfield.gfield_error input[type=radio],
	.gform_wrapper.gform_validation_error .gfield.gfield_error input[type=checkbox]{
		border: 2px solid #FF9D6C;
	}
	.gform_wrapper.gform_validation_error .gfield:not(.gfield_error) select{ color: #FFF;  }
	.gform_wrapper.gform_validation_error .gfield:not(.gfield_error) select.blankchoice{  color: rgba(255, 255, 255, 0.7);  }
	.gform_wrapper.gform_validation_error li.gfield_error div.ginput_complex.ginput_container label, 
	.gform_wrapper.gform_validation_error li.gfield_error ul.gfield_checkbox, 
	.gform_wrapper.gform_validation_error li.gfield_error ul.gfield_radio{
		color: #FF9D6C;
	}


/*---------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------*/
/*-------------------------------------------------------- RESPONSIVE STYLES */
/*---------------------------------------------------------------------------*/
/* Desktop */
@media only screen and (min-width : 1440px) {
	.section .inner{ max-width: 77%; }
}

/* iPad */
@media only screen and (max-width : 1180px) {
	.profile-graphic{ max-width: 40vw; }

	.flex-container .flex-item .content.padleft,
	.flex-container .flex-item.content_100w .content,
	.flex-container .flex-item.content_75w .content,
	.flex-container .flex-item.content_50w .content,
	.flex-container .flex-item.content_25w .content{ padding-left: 40px; padding-right: 40px; }
	.divline.padleft{ width: calc( 100% - 80px ); margin: 1rem auto; }

	#site-header .inner{ padding: 40px 0 20px 0; }
	#site-header .flex-container .flex-item.content_25w{ flex-basis: 50%; width: 50%; }
}

@media only screen and (max-width : 768px) {
	.profile-graphic{ max-width: 48vw; }

	.flex-container{ flex-wrap: wrap; }
	.flex-container:not(.flex-nowrap) .flex-item.content_75w{ flex-basis: 100%; width: 100%; }
	.flex-container:not(.flex-nowrap) .flex-item.content_50w{ flex-basis: 100%; width: 100%; }

	section.section_footer_contact .inner{ padding-bottom: 5vh; }
	section.section_footer_contact .flex-container .flex-item.content_33w{ flex-basis: 100%; width: 100%; }
	section.section_footer_contact .flex-container .flex-item.content_33w .content{ text-align: center; padding-top: 20px; }

	section.section_footer_contact #site-contact .text-small{ font-size: 1rem; }
	section.section_footer_contact #site-footer .text-small{ font-size: 0.8rem; }
	ul.site-footer-nav li{ margin: 0 12px 12px 12px; }

	ul.social-links li a { height: 34px; width: 34px; font-size: 14px; line-height: 36px; }
	ul.social-links li{ margin: 0 8px 12px 8px; }

	.gform_wrapper{ font-size: 1rem; }
}

/* Mobile */
@media only screen and (max-width : 680px) {
	section.section_colourband .inner { padding: 20vh 0; }

	.flex-container .flex-item .content.padleft,
	.flex-container .flex-item.content_100w .content,
	.flex-container .flex-item.content_75w .content,
	.flex-container .flex-item.content_50w .content,
	.flex-container .flex-item.content_25w .content{ padding-left: 30px; padding-right: 30px; }
	.divline.padleft{ width: calc( 100% - 60px ); }

	#site-header .inner{ padding: 20px 0 20px 0; }
	#site-header .inner .content{ padding-left: 20px; padding-right: 20px; }
}

