/*!
Theme Name: Sjoerds Loekie
Theme URI:
Author: Eric
Author URI:
Description: Kava child theme.
Template: kava
Version: 1.0.1
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kava-child
*/





/*** FONTS ***/
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;700&display=swap');



:root {
	/*** COLORS ***/
    --primary-color: #B10023;				/* red */
    --primary-color-darker: #97001E;

    --focus-color: #B10023;					/* red */
    --focus-color-darker: #97001E;

    --headings-color: #B10023;				/* red */
    --text-color: #000000;					/* black */
    --text-color-light: #9E9E9E;			/* light gray */

    --line-color: #E2E2E2;					/* light gray */
    --divider-color: #E2E2E2;

	--background-color: #ffffff;			/* white */

	--form-background-color: #fff;		       /* white */
	--field-background-color: #FBFBFB;		       /*  light gray */
    --field-line-color: #E2E2E2;                /*  light gray */

	--footer-background-color: #B10023;		/* red */

	--border-radius: 0;
	--border-width: 1px;
}

:focus {
    outline-color: transparent !important;
    outline-style: auto;
    outline-width: 0 !important;
}




/*** TEXT * HEADINGS ***/

body {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.5rem;   /* 25px */
	color: var(--text-color);
	line-height: 187%;
	font-weight: 400;
	background-color: var(--background-color);
    margin: 0;
}


p {
    margin-block-start: 0;
	margin-bottom: 1.50rem;
}

b,
strong,
.strong {
	font-weight: 700;
}

hr {
	color: var(--line-color);
	background-color: var(--line-color);
	border-color: var(--line-color);
	border-style: solid;
	border-width: var(--border-width);
	border-bottom: 0;
	margin: 20px 0 20px 0;
}

h1, h2, h3, h4, h5, h6 {
	/* font-family: 'Dancing Script', sans-serif; */
    font-family: 'Source Sans Pro', sans-serif;
	font-weight: 700;
	color: var(--headings-color);
	line-height: 100%;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.elementor-widget-heading .elementor-heading-title {
    line-height: 100%;
}



/* heading sizes */
h1 { font-size: 5rem;  /* 72px */ }
h2 { font-size: 3rem;  /* 48px */ }
h3 { font-size: 2rem;  /* 32px */ /* 2.5rem;  40px */ }
h4 { font-size: 1.5rem;  /* 24px */ }
h5 { font-size: 1.25rem;  /* 20px */ }
h6 { font-size: 1.125rem }


button, input, optgroup, select, textarea {
	font-size: 1.125rem /* 18px */;
}


.intro {
	font-size: 1.25rem;
    line-height: 150%;
}

.elementor-widget.elementor-widget-heading {

}

.jet-listing-not-found {
	font-size: 0.875em;
	line-height: 150%;
	color: var(--text-color-light);
}

.elementor-text-editor ul,
.elementor-text-editor ol {
	margin-bottom: 30px;
}

.elementor-text-editor ul li::marker {
  color: var(--focus-color);
}

figure.wp-caption figcaption {
	padding-top: 5px;
	text-align: left;
	font-size: 16px;
}

.swiper-slide {
	border: 0 !important;
}




/*** META INFO ***/

.meta {
	color: var(--text-color-light);
	font-size: 16px;
	line-height: 150%;
}





/*** LINKS ***/

a {
	color: var(--focus-color);
}

a:hover {
	color: var(--focus-color-darker);
}







/*** SUBHEADING ***/

.subheading {
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 10px !important;
}







/*** BUTTONS ***/


a.btn,
li.btn a,
.elementor-widget-button .elementor-button,
input[type=submit],
button[type=button],
button[type=submit],
.jet-form button {
    font-family: 'Source Sans Pro';
	font-weight: 700;
	background-color: var(--focus-color);
	padding: 15px 30px;
    letter-spacing: 2px;
	border: 0;
	font-size: 1rem;
	line-height: 100%;
	text-align: center;
	text-decoration: none !important;
	transition: all .1s ease-in-out;
	margin-bottom: 10px;
	color: #fff;
    text-transform: uppercase;
    box-shadow: 5px 10px 0 rgba(0, 0, 0, 0.05);
    border-radius: 0;
}




a.btn:hover,
li.btn a:hover,
.elementor-widget-button .elementor-button:hover,
input[type=submit]:hover,
input[type=button]:hover,
button[type=button]:hover,
button[type=submit]:hover,
.jet-form button:hover {
	/* background-color: var(--primary-color-lighter);
	box-shadow: 12px 12px 0 rgba(0, 0, 0, 0.05); */
	background-color: var(--focus-color-darker);
}




.elementor-widget-button .elementor-button:focus,
input[type=submit]:focus,
input[type=button]:focus,
button[type=button]:focus {
	background-color: var(--focus-color-darker);
	color: #fff;
	/* box-shadow: none; */
}


.elementor-widget-button.elementor-button-info .elementor-button,
.bn-reset button[type=button] {
	border: 1px solid var(--line-color);
	background-color: #fff;
	color: var(--focus-color);
	padding: 14px 29px;
}

.elementor-widget-button.elementor-button-success .elementor-button,
.elementor-widget-button.elementor-button-success .elementor-button a,
.jet-form button.btn-focus {
	background-color: var(--primary-color) !important;
	color: #fff;
}

.elementor-widget-button.elementor-button-success .elementor-button:hover,
.jet-form button.btn-focus:hover {
	background-color: var(--primary-color-darker) !important;
}







/*** LINK LISTS ***/

.link-list {

}

.link-list li {
	border: 0 !important;
	padding: 0;
}

.link-list li a,
.link-list li a span {
	color: var(--text-color);
}

.elementor-widget-icon-list .elementor-icon-list-item a .elementor-icon-list-text {
	color: var(--text-color);
}


.elementor-widget-icon-list .elementor-icon-list-item a:hover .elementor-icon-list-text,
.elementor-widget-icon-list .elementor-icon-list-item a:hover .elementor-icon-list-icon {
	color: var(--focus-color);
}















/*** FORMS ***/

input[type=date],
input[type=email],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
select,
textarea {
	border: 0 solid var(--field-line-color);
    border-width: 0 0 4px 0;
    background-color: var(--field-background-color);
	border-radius: 0;
	color: var(--text-color);
	padding: 14px 12px;
	line-height: 150%;
}

input[type=date]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=url]:focus,
select:focus,
textarea:focus {
    border-bottom-color: var(--focus-color);
}

select {
	padding: 17px 12px;
}

select::after {

}

input[type=text]::placeholder,
input[type=number]::placeholder {
	color: var(--text-color-light);
}

label,
.field-label {
	font-weight: 700;
	color: var(--secondary-color);
}

.form-group {
	margin-bottom: 10px;
}


.form-actions {
	text-align: center;
}

.form-actions input[type=submit] {
	margin: 0 auto;
}




/*** JET FORMS ***/



.jet-form-row {
	padding-top: 0;
    padding-bottom: 10px;
}

.jet-form__heading .jet-form__label-text {
	margin: 20px 0 10px 0;
	font-size: 1.75rem;
}


.jet-form__label {
	color: var(--secondary-color);
}


.jet-form__label .jet-form__label-text {
	font-weight: 700;
}

.jet-form__heading .jet-form__label-text {
    font-family: 'Rajdhani';
    font-weight: 700;
	color: var(--primary-color);
}


.jet-form-field-container .jet-form__label .jet-form__label-text {
	margin-top: 10px;
	margin-bottom: 10px;
}


.jet-form-field-container .jet-form__desc {
	color: var(--text-color-light);
}



.jet-form__field-label {
	font-weight: 400;
}

.jet-form .field-type-radio {
	margin: 10px 0;
}

.jet-form button {
	margin: 10px auto;
}


.number-field input[type="number"] {
	flex-basis: auto;
	width: 80px !important;
	max-width: 80px !important;
	display: inline-block;
	float: left !important;
	margin-right: 20px;
}

.number-field input[type="number"]::after {
	clear: none;
	content: "";
	display: none;
}

.number-field .jet-form__desc {
	margin-top: 4px;
    align-self: stretch;
	display: inline-block;
	float: left !important;
	font-size: 18px;
	flex: initial !important;
	color: var(--text-color);
}

.jet-form__heading-desc {
	margin: 8px 0 8px 0;
}


.jet-form-field-container input[type=checkbox],
.jet-form-field-container input[type=radio] {
	margin-right: 20px;
}

.jet-form-row.jet-form-row--submit {
    margin-top: 20px;
}















































/*** LAYOUT ***/

#page-content {
    padding-top: 90px;
    padding-bottom: 90px;
}

#page-content > .elementor-container > .elementor-row > .elementor-column {
    padding-left: 40px;
    padding-right: 40px;
}


.content-section {
    padding-top: 80px;
    padding-bottom: 80px;
}










/*** FOOTER ***/


#footer {
    color: #fff;
	background-color: var(--footer-background-color);
    padding-top: 50px;
    padding-bottom: 50px;
}

#footer p {
    margin-bottom: 0;
}











/*** NOTIFICATION BAR ***/

#notification-bar {
    background-color: var(--primary-color);
    color: #fff;
    z-index: 1;
    margin-top: -120px;
}

#notification-bar p {
    margin-bottom: 0;
}

#notification-bar h2 {
    color: #fff;
}






































/*** FORM WRAPPER ***/


.form-wrapper {
	margin-bottom: 30px;
	box-sizing: border-box;
	background-color: var(--form-background-color);
	padding: 30px;
}



.form-header {
	padding: 30px 30px 0 30px;
}

.form-results {
	padding: 30px;
	background-color: var(--primary-color);

}

.form-results h1,
.form-results h2,
.form-results h3,
.form-results h4,
.form-results h5,
.form-results h6,
.form-results p {
	color: #fff;
}




























































/*** RESPONSIVE STUFF ***/


/* desktops */
@media screen and (min-width: 1025px) {

    .hidden-desktop {
        display: none !important;
    }

    .narrow {
		padding: 0 150px;
	}


}



/* tablets */
@media screen and (max-width: 1024px) {




}




/* mobile */
@media screen and (max-width: 767px) {


	body {
		font-size: 1rem;   /* 16px */
	}

	h1 {
        font-size: 3.5rem;
    }

    h2 {
        font-size: 2rem;
    }

    h3 {
        font-size: 1.75rem;
    }

    h4 {
        font-size: 1.5rem;
    }

    h5 {
        font-size: 1.25rem;
    }

    .subheading {
        font-size: 1.25rem;
    }

    .news-listing h4 {
        font-size: 1.25rem;
    }

    #page-content{
        padding-top: 50px;
        padding-bottom: 50px;
    }

    #page-content > .elementor-container > .elementor-row > .elementor-column {
        padding-left: 0;
        padding-right: 0;
    }


    #logo img {
        width: 280px;
    }

    #notification-bar {
        height: 90px;
        min-height: 90px;
        margin-top: -90px;
    }


    #footer {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}
