/*
 Theme Name:     JWB Theme
 Theme URI:      https://www.boxcreative.ie/
 Description:    Divi Child Theme
 Author:         B[]X	
 Author URI:     https://www.boxcreative.ie
 Template:       Divi
 Version:        3.0.1
*/
 
@import url("../Divi/style.css");
 
/* =Theme customization starts here
------------------------------------------------------- */


/* ************************************************************* */
/* defaults */

:root {

    /* old colours */
    --color-white: #FFFFFF;
    --color-browndark: #422a18;
    --color-brown: #6a575c;
    --color-cream: #f5f1e9;
    --color-greylight: #7f7f7f;
    --color-greylight2: #d0c7be;

    /* New Font/text values */
    /*--default-font-family-filson-pro: 'Filson ';*/
    --font-family-butler: 'Butler', serif;
    --font-family-roboto: 'Roboto Condensed', Open Sans, Arial, sans-serif;
    --font-style-normal: normal;
    --font-weight-normal: 400;
    --font-weight-100: 100;
    --font-weight-400: 400;
    --font-weight-bold: 600;
    --font-weight-700: 700;
    --font-size-15: 15px;
    --font-size-34: 34px;
    --font-size-44: 44px;
    --font-size-button: 14px;
    --character-spacing-0: 0px;
    --character-spacing-0-5: 0.5px;
    --character-spacing-1: 1px;
    --character-spacing-1-5: 1.5px;
    --character-spacing-2: 2px;
    --line-height-1-2: 1.2em;
    --line-height-1-3: 1.3em;
    --line-height-1-5: 1.5em;
    --line-height-1-7: 1.7em;
    --text-transform-uppercase: uppercase;

    /* Shape sizes */
    --size-radius-header-desktop: 100px;
    --size-radius-header-mobile: 50px;
    --size-radius-news-desktop: 50px;
    --size-radius-news-mobile: 30px;
    --size-pin-size: 168px;
    --size-pin-size-medium: 120px;
    --size-pin-top: -84px;
    --size-pin-top-medium: -60px;
    --size-pin-size-mobile: 84px;
    --size-pin-top-mobile: -42px;
    --size-pin-size-medium-mobile: 80px;
}

html, body {
    background-color: #f4f2e9;
}
body {
    /* fix for popups */
    padding-right: 0 !important;
    font: var(--font-style-normal) normal var(--font-weight-normal) var(--font-size-15)/var(--line-height-1-5) var(--font-family-roboto);
    color: var(--color-browndark);
    text-align: left;
}



.et_pb_section .color-white, .color-white { color: #ffffff; }
.et_pb_section .color-black, .color-black   { color: #000000; }
.et_pb_section .color-cream, .color-cream { color: var(--color-cream); }
.et_pb_section .color-browndark, .color-browndark { color: var(--color-browndark) }
.et_pb_section .color-brown, .color-brown { color: var(--color-brown) }

.et_pb_section .color-greylight, .color-greylight { color: var(--color-greylight) }



h1 { font-size: var(--font-size-44); font-weight: var(--font-weight-400); letter-spacing: var(--character-spacing-2); line-height: var(--line-height-1-2); }
h2 { font-size: var(--font-size-34); font-weight: var(--font-weight-400); letter-spacing: var(--character-spacing-2); line-height: var(--line-height-1-3); }
h3 { font-size: 30px; font-weight: 700; letter-spacing: 0; line-height: 1.26em; }
h4 { font-size: 28px; font-weight: normal; letter-spacing: 0; line-height: 1.36em; }
h5 { font-size: 21px; font-weight: normal; letter-spacing: 0; line-height: 1.47em; }
h6 { font-size: 19px; font-weight: normal; letter-spacing: 0; line-height: 1.47em; }

h1,
h2,
h3 {
    font-family: var(--font-family-butler);
    color: var(--color-browndark);
}


.et_pb_column_1_3 h1, .et_pb_column_1_4 h1, .et_pb_column_1_5 h1, .et_pb_column_1_6 h1, .et_pb_column_2_5 h1 { font-size: 44px; }
.et_pb_column_1_3 h2, .et_pb_column_1_4 h2, .et_pb_column_1_5 h2, .et_pb_column_1_6 h2, .et_pb_column_2_5 h2 { font-size: 34px; }
.et_pb_column_1_3 h3, .et_pb_column_1_4 h3, .et_pb_column_1_5 h3, .et_pb_column_1_6 h3, .et_pb_column_2_5 h3 { font-size: 30px; }
.et_pb_column_1_3 h4, .et_pb_column_1_4 h4, .et_pb_column_1_5 h4, .et_pb_column_1_6 h4, .et_pb_column_2_5 h4 { font-size: 28px; }
.et_pb_column_1_3 h5, .et_pb_column_1_4 h5, .et_pb_column_1_5 h5, .et_pb_column_1_6 h5, .et_pb_column_2_5 h5 { font-size: 21px; }
.et_pb_column_1_3 h6, .et_pb_column_1_4 h6, .et_pb_column_1_5 h6, .et_pb_column_1_6 h6, .et_pb_column_2_5 h6 { font-size: 19px; }


@media only screen and ( min-width: 981px ) and ( max-width: 1199px ) {
    .et_pb_column_1_3 h1, .et_pb_column_1_4 h1, .et_pb_column_1_5 h1, .et_pb_column_1_6 h1, .et_pb_column_2_5 h1 { font-size: 34px; }
    .et_pb_column_1_3 h2, .et_pb_column_1_4 h2, .et_pb_column_1_5 h2, .et_pb_column_1_6 h2, .et_pb_column_2_5 h2 { font-size: 30px; }
    .et_pb_column_1_3 h3, .et_pb_column_1_4 h3, .et_pb_column_1_5 h3, .et_pb_column_1_6 h3, .et_pb_column_2_5 h3 { font-size: 28px; }
    .et_pb_column_1_3 h4, .et_pb_column_1_4 h4, .et_pb_column_1_5 h4, .et_pb_column_1_6 h4, .et_pb_column_2_5 h4 { font-size: 21px; }
    .et_pb_column_1_3 h5, .et_pb_column_1_4 h5, .et_pb_column_1_5 h5, .et_pb_column_1_6 h5, .et_pb_column_2_5 h5 { font-size: 19px; }
    .et_pb_column_1_3 h6, .et_pb_column_1_4 h6, .et_pb_column_1_5 h6, .et_pb_column_1_6 h6, .et_pb_column_2_5 h6 { font-size: 17px; }

}


@media only screen and ( max-width: 980px ) {
    h1 { font-size: 38px; }
    h2 { font-size: 28px; }
    h3 { font-size: 24px; }
    h4 { font-size: 21px; }
    h5 { font-size: 16px; }

    .et_pb_column_1_3 h1, .et_pb_column_1_4 h1, .et_pb_column_1_5 h1, .et_pb_column_1_6 h1, .et_pb_column_2_5 h1 { font-size: 38px; }
    .et_pb_column_1_3 h2, .et_pb_column_1_4 h2, .et_pb_column_1_5 h2, .et_pb_column_1_6 h2, .et_pb_column_2_5 h2 { font-size: 28px; }
    .et_pb_column_1_3 h4, .et_pb_column_1_4 h4, .et_pb_column_1_5 h4, .et_pb_column_1_6 h4, .et_pb_column_2_5 h4 { font-size: 21px; }
    .et_pb_column_1_3 h5, .et_pb_column_1_4 h5, .et_pb_column_1_5 h5, .et_pb_column_1_6 h5, .et_pb_column_2_5 h5 { font-size: 16px; }
}

.et_pb_section p {
    letter-spacing: var(--character-spacing-1);
    font-weight: var(--font-weight-100);
}


/* ------------------------------------------------------------------------ */
/* --------   Header and Navigation   ------------------------------------- */
/* ------------------------------------------------------------------------ */

#main-header.nonav-header {
    border-bottom: 30px solid var(--color-brown);
}
.et_header_style_left #main-header.nonav-header .logo_container {
    position: relative;
    height: 90px;
    width: 100%;
    text-align: center;
}


/* ------------------------------------------------------------------------ */
/* --------   buttons   ---------------------------------------------------- */
/* ------------------------------------------------------------------------ */

input[type="button"], input[type="submit"], #searchform input[type="submit"],
.gform_wrapper .gform_footer input.button,
.morelink .button, .jw-button,
.pagination .next-page a,
.pagination .previous-page a,
#page-container .contact-form .gform_button,
#page-container .et_pb_button,
.et_pb_button {
    font-family: var(--font-family-roboto);
    font-size: var(--font-size-button);
    line-height: var(--line-height-1-3) !important;
    font-weight: var(--font-weight-700);
    letter-spacing: var(--character-spacing-1-5);
    padding: 0.8em 3.2em !important;
    border: 1px solid var(--color-brown);
    color: var(--color-brown);
    background-color: transparent;
    transition: all 0.3s ease-in-out !important;
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    border-radius: 0;
}
input[type="button"]:hover, input[type="submit"]:hover, #searchform input[type="submit"]:hover,
.gform_wrapper .gform_footer input.button:hover,
.morelink .button:hover, .jw-button:hover,
.pagination .next-page a:hover,
.pagination .previous-page a:hover,
#page-container .contact-form .gform_button:hover,
#page-container .et_pb_button:hover,
.et_pb_button:hover {
    color: #ffffff;
    background-color: var(--color-brown);
}






/* ********************************************************************* */
/* ****** Signup section  ********************************************** */
/* ********************************************************************* */


.signup-module {
    padding: 8% 10% 8% 5%;
}

.signup-module .gform_wrapper { margin-top: 10px; }

.signup-form-wrap input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]),
.signup-form-wrap textarea {
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #422a18;
    font-size: 15px;
    padding: 10px;
    margin-top: 5px;
    width: min(100%, 400px);
}
.note-required { color: #422a18; font-size: 13px; }
.field-required {
    position: relative;
    font-size: 16px;
    display: inline-block;
    padding: 0 5px;
    width: 1em;
    height: 1.0em;
}
.field-required::after {
    content: '*';
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 1.0em;
    height: 1.0em;
    object-fit: fill;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    /* background-image: url('images/star-icon-orange.svg'); */
}


.signup-form-wrap input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #422a18;
    font-size: 14px;
    opacity: 1;
}
.signup-form-wrap input::-moz-placeholder { /* Firefox 19+ */
    color: #422a18;
    font-size: 14px;
    opacity: 1;
}
.signup-form-wrap input:-ms-input-placeholder { /* IE 10+ */
    color: #422a18;
    font-size: 14px;
    opacity: 1;
}
.signup-form-wrap input:-moz-placeholder { /* Firefox 18- */
    color: #422a18;
    font-size: 14px;
    opacity: 1;
}
.signup-module .gform_wrapper.gravity-theme .gform_fields {
    grid-row-gap: 10px;
}

h2.gform_submission_error {
    font-family: var(--font-family-roboto);
    padding-bottom: 0;
}
.gform_validation_errors .gform-icon--close::before {
    content: "!";
}

@media only screen and ( min-width: 981px ) {
    .et_pb_gutters1.et_pb_row .et_pb_column_1_2.cont-half-left {
        max-width: 600px;
        margin-left: auto;
    }
    .signup-module .et_pb_text_inner {
        max-width: 400px;
    }

}
@media only screen and ( max-width: 980px ) {

    .signup-module {
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }
    .custom-mobile-order { display: flex; flex-direction: column; }
    .mobile-spacer { padding-top: min(40%,250px); }
    .mobile-order1 { order: 1;}
    .mobile-order2 { order: 2;}
}






/* ********************************************************************* */
/* ****** Products link  ****************************************************** */
/* ********************************************************************* */

.products-link a {
    display: inline-block;
    text-align: center;
    padding-bottom: 10px;
    max-width: 240px;
    position: relative;
}
.products-link a::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    transition: all 0.2s ease-in-out;
    border-bottom: 2px solid #3c2415;
}
.products-link a:hover::after { width: 70%; left: 15%; }



/* ********************************************************************* */
/* ****** Footer  ****************************************************** */
/* ********************************************************************* */

#footer-widgets {
    display: flex;
    flex-direction: row;
}
#main-footer #footer-widgets {
    padding-top: 35px;
}
#footer-widgets .footer-widget { }
#footer-widgets .footer-widget:nth-child(1){
    text-align: left;
}
#footer-widgets .footer-widget:nth-child(2){
    text-align: right;
    display: flex;
    flex-direction: column;
}


@media only screen and ( min-width: 981px ) {

    .et_pb_gutters3 #footer-widgets .footer-widget { margin-bottom: 15px; }
    #footer-widgets .footer-widget:nth-child(2){}
    .et_pb_gutters3.et_pb_footer_columns2 .footer-widget .fwidget { margin-bottom: 5px; }

}
@media only screen and ( max-width: 980px ) {

    #footer-widgets .footer-widget .fwidget,
    .et_pb_gutters3.et_pb_footer_columns2 .footer-widget .fwidget { margin-bottom: 5px; }

}
@media only screen and ( max-width: 767px ) {

    #footer-widgets {
        display: flex;
        flex-direction: column;
    }
    #footer-widgets .footer-widget:nth-child(1) { order: 2; }
    #footer-widgets .footer-widget:nth-child(2) { order: 1; }
    #footer-widgets .footer-widget:nth-child(n), #footer-widgets .footer-widget .fwidget {
        margin-bottom: 5px !important;
        text-align: left;
    }

}
@media only screen and ( max-width: 479px ) {
    .footer-widget .fwidget { margin-bottom: 0 !important; }
}







