/*
Theme Name: Nine Careers Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: A custom child theme of Beaver Builder theme for Nine Careers
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */ 

/* Font Face */

@font-face {
    font-family: 'Proxima Nova';
    src: url('/wp-content/themes/nine-careers/assets/fonts/ProximaNova-Bold-webfont.woff') format('woff2'),
        url('/wp-content/themes/nine-careers/assets/fonts/ProximaNova-Bold-webfont.woff2') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('/wp-content/themes/nine-careers/assets/fonts/ProximaNova-Reg-webfont.woff') format('woff2'),
        url('/wp-content/themes/nine-careers/assets/fonts/ProximaNova-Reg-webfont.woff2') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Global */

:root {
    /* Colours */
    --navy: #070720;
    --aqua: #008FE2;
    --light-grey: #f5f5f5;
    --dark-grey: #333;
    --gradient: linear-gradient(134.72deg, #24CCF3 -0.81%, #2183F5 101.07%);
    /* Fonts */
    --primary-font: "Proxima Nova", 'helvetica', sans-serif;
    --regular: 400;
    --bold: 700;
    --extra-bold: 800;
    --text-base: 1.8rem;
    --text-menu: 1.6rem;
    /* Gap */
    --py: 3.2rem;
    --half-py: 1.6rem;
    --half-px: 1.6rem;
    --px: 3.2rem;
    /* Transitions */
    --trans-button: background-color 0.25s, color 0.25s;
    --trans-text: color 0.25s;
}

@property --gradientlight {
    syntax: '<color>';
    initial-value: #24CCF3;
    inherits: false;
}

@property --gradientdark {
    syntax: '<color>';
    initial-value: #2183F5;
    inherits: false;
}

body {
    font-family: var(--primary-font) !important;
}

h1, h2, h3, h4, h5, h6, p {
    font-family: var(--primary-font) !important;
}

.flex {
    display: flex;
}

.space-between {
    justify-content: space-between;
}

.items-center {
    align-items: center;
}

.justify-start {
    justify-content: flex-start;
}

.justify-end {
    justify-content: flex-end;
}

.align-bottom {
    align-items: flex-end;
}

h1 strong, h2 strong, h3 strong, h4 strong, h5 strong {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.gform-body input[type="text"], .gform-body textarea {
    border-radius: 9px;
    font-size: var(--text-menu);
    padding: 16px 20px !important;
    background: var(--navy) !important;
    border: 0;
    color: white;
    font-size: 18px;
}

.gform-body textarea {
    height: 120px !important;
}

.gform-body .ginput_container *::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #BBB;
    opacity: 1; /* Firefox */
}

.gform-body .ginput_container *:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #BBB;
}

.gform-body .ginput_container *::-ms-input-placeholder { /* Microsoft Edge */
    color: #BBB;
}

.btn, .facetwp-load-more {
	border-radius: 40px;
	color: #fff;
	font-size: 16px;
	font-weight: var(--bold);
	padding: 16px 28px 18px;
	text-decoration: none !important;
    --gradientlight: #24CCF3;
    --gradientdark: #2183F5;
	background: linear-gradient(140deg, var(--gradientlight), var(--gradientdark));
    transition: --gradientlight 0.25s, --gradientdark 0.25s, color 0.25s;
    border: 0 !important;
}

.btn:hover {
	--gradientlight: #2183F5;
    --gradientdark: #24CCF3;
    color: #fff;
}

.ginput_container {
    --gradientlight: #24CCF3;
    --gradientdark: #2183F5;
    background: linear-gradient(140deg, var(--gradientlight), var(--gradientdark));
    transition: --gradientlight 0.25s, --gradientdark 0.25s, color 0.25s;
    margin: 0;
    padding: 2px;
    font-weight: var(--regular);
    color: white;
    border-radius: 10px;
    font-size: var(--text-menu);
    position: relative;
}

.gform_footer input[type="submit"], .gradient-ring .fl-icon {
    --gradientlight: #24CCF3;
    --gradientdark: #2183F5;
    background: linear-gradient(140deg, var(--gradientlight), var(--gradientdark));
    transition: --gradientlight 0.25s, --gradientdark 0.25s, color 0.25s;
    font-weight: var(--bold);
    color: white;
    border-radius: 32px;
    font-size: var(--text-menu);
    padding: 14px 24px 15px;
    height: 52px;
    position: relative;
    border: 0;
    line-height: 1 !important;
}

.gform_footer input[type="submit"]:hover, .ginput_container:hover {
    --gradientlight: #2183F5;
    --gradientdark: #24CCF3;
    color: #fff;
}

.gform_wrapper.gravity-theme .gform_fields {
    grid-row-gap: 22px !important;
}

.gradient-ring .fl-icon {
    width: 51px;
    padding: 2px;
}

.gradient-ring .fl-icon i {
    background-color: var(--navy);
    padding: 15px 16px;
    border-radius: 50px;
    transition: background-color 0.25s, color 0.25s;
}

.gradient-ring .fl-icon:hover i {
    background-color: transparent;
}

.fl-page-content {
    overflow: hidden;
}

.hero-row-height .fl-row-content-wrap {
    height: 100vh;
    min-height: auto;
    max-height: 1200px;
}

.gform_confirmation_message {
    color: white;
}

.gfield--type-captcha {
    visibility: hidden;
    position: absolute;
    z-index: -20;
}