/*
Theme Name: Basketball.nl 
Theme URI: http://basketball.nl
Description: Theme for basketball.nl. Child Theme For Divi.
Author: Bmade
Author URI: http://bmade.nl
Version: 1.0.162674
Template: Divi
*/

/*!**********************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/style.scss ***!
  \**********************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap);
/*!***************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/body.scss ***!
  \***************************************************************************************************************/
/* Excuse all the !importants. We are overruling some (inline) CSS from the parent theme-settings. */

body {
    --main-orange: #fa4a00;
    --main-blue: #000033;
    --fontHeading: 'Bebas Neue', sans-serif;
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif !important;
    font-weight: 300;
}

.hideField {
    display: none;
}

.et_pb_widget.widget_nav_menu {
    padding: 16px 12px;
}
/*!***************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/h1-6.scss ***!
  \***************************************************************************************************************/
/* Excuse all the !importants. We are overruling some (inline) CSS from the parent theme-settings. */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--fontHeading);
    font-weight: normal;
    line-height: .9;
    text-transform: uppercase;
    text-shadow: none!important;
}

h1 {
    font-size: 64px !important;
}
h2 {
    font-size: 48px !important;
}
h3 {
    font-size: 36px !important;
}
h4 {
    font-size: 28px !important;
}
h5 {
    font-size: 22px !important;
}
h6 {
    font-size: 18px !important;
}
/*!******************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/buttons.scss ***!
  \******************************************************************************************************************/
.et_pb_button {
    font-family: var(--fontHeading);
    font-weight: normal;
    text-transform: uppercase;
}
/*!***********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/sidebar-menu.scss ***!
  \***********************************************************************************************************************/
.et_pb_widget_area_left {
    border: 0;
    padding: 0;
    margin: 0;
}

/* There is a bug in the Divi Theme / Widget Area where the classes are wrapped in quotes (”). But using the selector on line 8 we are able to work around this. */
[class*="sidebar-menu"],
.sidebar-menu {
    font-size: 15px;
    text-transform: uppercase;
    font-family: var(--fontHeading);

    a {
        display: block;
    }

    .menu {
        box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.15);

        >.menu-item {
            margin: 0;

            >a {
                padding: 16px 16px 16px;
                color: #003;
                background: #fff;

                &:hover {
                    background: var(--main-orange);
                    color: #fff;
                }
            }
        }

        .menu-item.current_page_item>a {
            color: var(--main-orange);
            pointer-events: none;
        }

        .sub-menu {
            margin: 0 0 0 0;
            padding: 0 0 0 16px;
            background: #f4f4f4;

            .menu-item {
                margin: 0;
                padding: 0;
            }

            a {
                padding: 8px 8px 8px 16px;
                color: rgba(0, 0, 51, 0.5);
                font-size: 14px;
                font-weight: 400;

                &:hover {
                    background: var(--main-orange);
                    color: #fff;
                }
            }
        }
    }
}
/*!************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/call-to-action-horizontal.scss ***!
  \************************************************************************************************************************************/
/* Excuse all the !importants. We are overruling some (inline) CSS from the parent theme-settings. */

.call-to-action-horizontal {
    display: flex;
    align-items: center;

    .et_pb_column_3_8 {
        width: 30% !important;
    }

    .et_pb_column_3_8.et-last-child {
        width: 70% !important;
    }
}
/*!*******************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/call-to-action-basic.scss ***!
  \*******************************************************************************************************************************/
/* Excuse all the !importants. We are overruling some (inline) CSS from the parent theme-settings. */

/* There is a bug in the Divi Theme where the classes are wrapped in quotes (”). But using the selector on line 4 we are able to work around this. */
[class*="call-to-action-basic"],
.call-to-action-basic {
    padding: 16px !important;
    background: #fff;
    transition: .25s;
    display: flex;
    align-items: center;
    box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.3);

    @media screen and (min-width: 960px) {
        padding: 32px !important;
    }

    >div:first-of-type {
        width: 12.5% !important;
    }

    h6 {
        opacity: .75;
    }

    >div {
        margin: 0 !important;
    }

    >div:nth-child(2) {
        width: 80% !important;
        margin-left: auto;
        display: flex;
        gap: 4px;
        flex-direction: column;

        @media screen and (min-width: 960px) {
            align-items: center;
            flex-direction: row;
            gap: 8px;
        }
    }

    >.et-last-child {
        width: 7.5% !important;
        margin-left: auto;
    }
}

.call-to-action-basic:hover {
    transform: scale(1.05);
}
/*!************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/location-card.scss ***!
  \************************************************************************************************************************/
/* There is a bug in the Divi Theme / Widget Area where the classes are wrapped in quotes (”). But using the selector on line 8 we are able to work around this. */
[class*="location-card"],
.location-card {
    padding: 16px;
    margin: 16px 0;

    background: #fff;
    box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.3);

    @media screen and (min-width: 960px) {
        padding: 32px;
        margin: 32px 0;
    }

    a {
        color: var(--main-orange);

        &:hover {
            text-decoration: underline;
        }
    }

    /** This add a 'out icon'  if a link opens en new window **/
    a[target="_blank"]::after {
        content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==);
        margin: 0 3px 0 8px;
        opacity: .5;
    }

    /** The content is a wysiwyg field. So this way we are still able to target the google maps link **/
    a[href*=google][href*=maps] {
        display: inline-block;
        text-transform: uppercase;
        font-weight: normal;
        font-family: var(--fontHeading);
        margin-top: 16px;
    }
}
/*!********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/hamburger.scss ***!
  \********************************************************************************************************************/
.mobile_menu_bar:before {
    color: var(--main-orange)
}
/*!**********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/search-icon.scss ***!
  \**********************************************************************************************************************/
#et_search_icon {
    &:hover {
        color: var(--main-orange);
    }
}
/*!*********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/pagination.scss ***!
  \*********************************************************************************************************************/
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    font-family: var(--fontHeading);
    text-transform: uppercase;

    .alignleft,
    .alignright {
        min-width: 200px;

        a {
            color: #000;
            opacity: .6;
            font-weight: 400;

            &:hover {
                opacity: 1;
            }
        }
    }

    .alignleft {
        text-align: right;
    }

    .alignright {
        text-align: left;
    }

    &:after {
        display: none;
    }

}
/*!********************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/blog-grid.scss ***!
  \********************************************************************************************************************/
.et_pb_blog_grid {
    .et_pb_post {
        transition: .25s;

        .more-link {
            display: block;
            text-align: center;
            font-family: var(--fontHeading);
            font-weight: 400;
            color: var(--main-orange);
            text-transform: uppercase;

            &:hover {
                text-decoration: underline;
            }
        }

        .post-meta {
            font-family: var(--fontHeading);
            font-weight: 400;
            text-transform: uppercase;
            margin: 16px auto;
        }

        &:hover {
            transform: scale(1.05);

            .more-link {
                text-decoration: underline;
            }
        }
    }
}

/*!*****************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/partials/footer.scss ***!
  \*****************************************************************************************************************/
footer {
    .et_pb_row_1_tb_footer {
        position: relative;
        margin-top: -80px;
        z-index: 1;
        color: var(--main-orange);

        @media (min-width: 1024px) {
            margin-top: -120px;
        }

        ul li {

            &::marker {
                color: var(--main-orange);
            }

            a {
                color: var(--main-blue);

                &:hover {
                    text-decoration: underline;
                }
            }
        }
    }

    ul.et_pb_social_media_follow li {
        padding-right: .5rem;

        a {
            transition: .25s;
            background-repeat: no-repeat;
            background-position: center center;

            &:hover {
                text-decoration: none;
                transform: scale(1.1);
            }
        }
    }
}
/*!**************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./httpdocs/wp-content/themes/divchild/scss/style.scss (1) ***!
  \**************************************************************************************************************************************************/
/*!
Theme Name: Basketball.nl 
Theme URI: http://basketball.nl
Description: Theme for basketball.nl. Child Theme For Divi.
Author: Bmade
Author URI: http://bmade.nl
Version: 1.0.0
Template: Divi
*/
/* Google Fonts include with Bebas Neue */

/*# sourceMappingURL=style.css.map*/