/*
Theme Name: 	BuddyBoss Child
Theme URI: 		https://www.buddyboss.com/
Description: 	A child theme of BuddyBoss Theme. To ensure easy updates, make your own edits in this theme.
Author: 		BuddyBoss.com
Author URI: 	https://www.buddyboss.com/
License: 		GNU General Public License v3 or later
License URI: 	http://www.gnu.org/licenses/gpl-3.0.html
Template: 		buddyboss-theme
Version: 		1.0.0
*/

/*

-- Stylesheet locations --

Add your own customizations into /css/custom.css in this child theme.

Parent styles are called from /buddyboss-theme/inc/theme/functions.php in the 
parent theme and are located in /buddyboss-theme/assets/css/ in the parent theme.


--- If you are editing CSS via the WordPress admin, do the following ---

1. Install the plugin WP Editor: http://wordpress.org/plugins/wp-editor/
2. Navigate to Appearance > Theme Editor in the WordPress admin.
3. Navigate into the /css/ folder of your child theme to edit custom.css.

*/

@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');
*:not(.fa-map-marker):not(i):not(.ab-icon) {
    font-family: 'Nunito Sans', sans-serif !important;
}

/*#wpadminbar { display:none !important;}*/

.bb-grid{
    display: block !important;
}

.bp-radio-wrap:first-of-type {
    display: none !important;
}

#public-group-description {
    display: none !important;
}

.shownDom{
    display: block;
}

.hiddenDom{
    display: none;
}

.shownDomImp{
    display: block !important;
}

.hiddenDomImp{
    display: none !important;
}

.unclickable{
    pointer-events: none;
}

#wp-admin-bar-my-account-groups-create, #groups-create{
    display: none !important;
}

#listings-personal-li{
    pointer-events: none;
}

.generic-button{
    pointer-events: none;
}

#content{
    visibility: hidden;
}

#searchBar{
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
    width: 350px;
    height: 55px;
}

#findPerfect{
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
}

.directorist-archive-grid-view{
    display: flex;
    flex-direction: column;
}

/* create a group */
.create{
    display: grid;
    align-items: stretch;
    height: 500px;
}

.create h1{
    margin-top: 50px;
}

.create input{
    height: 85px;
}

.create textarea{
    resize: none;
    height: 125px;
}

.buttonfield{
    display: flex;
    justify-content: center;
    margin: 30px;
}

.errorcode{
    color: red;
}

.shown{
    display: block;
}

.hidden{
    display: none;
}

.custom-leave{
    margin-top: -50px;
    z-index: 999;
    position: absolute;
    right: 50px;
}

.buttonfield{
    display: flex;
    justify-content: center;
    margin-right: auto;
    margin-left: auto;
}

/*#creationbutton{*/
/*    background-color: #1169B0;*/
/*    display: grid;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    width: 300px;*/
/*    height: 70px;*/
/*    border-radius: 40px;*/
/*    cursor: pointer;*/
/*    transition: 0.2s ease-out;*/
/*}*/

/*#creationbutton:hover{*/
/*    background-color: #EF7F1A;*/
/*    transition: 0.2s ease-out;*/
/*}*/

/*#creationbutton h1{*/
/*    font-weight: 500;*/
/*    color: white;*/
/*    margin: 0;*/
/*}*/

#creationbutton h4{
    font-size: 30px;
}

#listings, #leavePost{
    width: 30%;
}

#openListings {
    background-color: #1169B0;
    display: grid;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    border: 1px solid #1169B0;
    cursor: pointer;
    transition: 0.2s ease-out;
    z-index: 99;
    position: relative;
}

#openListings h1{
    color: white;
    font-weight: 500;
    font-size: 17px;
    margin: 0;
}

#openListings:hover{
    background-color: white;
    transition: 0.2s ease-out;
}

#openListings:hover > h1{
    color: #1169B0;
    transition: 0.2s ease-out;
}

#leavebutton, #copyButton{
    background-color: #1169B0;
    display: grid;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    border: 1px solid #1169B0;
    cursor: pointer;
    transition: 0.2s ease-out;
    z-index: 99;
    position: relative;
}

#leavebutton h1{
    font-weight: 500;
    font-size: 17px;
    color: white;
    margin: 0;
}

#copyButton{
    width: 30%;
}

#copyButton h1{
    font-weight: 500;
    font-size: 17px;
    color: white;
    margin: 0;
    line-height: 1;
    text-align: center;
}

#leavebutton:hover, #copyButton:hover{
    background-color: white;
    transition: 0.2s ease-out;
}

#leavebutton:hover > h1{
    color: #1169B0;
    transition: 0.2s ease-out;
}

#copyButton:hover > h1{
    color: #1169B0;
    transition: 0.2s ease-out;
}


.buttonColl{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 15px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.mainlogo{
    position: absolute;
    height: 70px;
    margin-left: 50px;
}

.site-title, .site-title a{
    color:  #1169B0;
}

@media(max-width: 1630px){
    #site-logo{
        padding-left: 100px;
    }
}
@media(max-width: 1400px){
    #site-logo{
        padding-left: 150px;
    }
}

.bb-menu-item, .bb-menu-item span, .bb-menu-item i{
    color:  #1169B0 !important;
    transition: 0.2s ease-out;
}

.current-menu-item > a > span, .current-menu-item > a > i{
    color: #EF7F1A !important;
    transition: 0.2s ease-out;
}

.bb-menu-item:hover > i{
    color: #EF7F1A !important;
    transition: 0.2s ease-out;
} 

.bb-menu-item:hover > span{
    color: #EF7F1A !important;
    transition: 0.2s ease-out;
} 

.site-title, .site-title a{
    color:  #1169B0 !important;
    transition: 0.2s ease-out;
}

.site-title:hover, .site-title a:hover{
    color:  #EF7F1A !important;
    transition: 0.2s ease-out;
}

.user-wrap.menu-item-has-children .user-name{
    color:  #1169B0 !important;
    transition: 0.2s ease-out;
}

.user-wrap.menu-item-has-children .user-name:hover{
    color:  #EF7F1A !important;
    transition: 0.2s ease-out;
}

.groupAssocButton{
    height: 65px;
    width: 190px;
    background-color: black;
    border-radius: 40px;
    cursor: pointer;
    display: grid;
    align-items: center;
    justify-content: center;
    transition: 0.2s ease-out;
    margin-left: 50px;
    margin-bottom: 50px;
}

.groupAssocButton:hover{
    background-color: #565656;
    transition: 0.2s ease-out;
}

.groupAssocButton h4{
    color: white;
    font-size: 17px;
    margin: 0;
}

/*#groupbutton-53{*/
/*    display: none;*/
/*}*/

#checkBoxInputs, #checkBoxInputs2{
    display: flex; flex-direction: column;
}

.leaflet-touch .leaflet-bar a{
    width: 60px !important;
    height: 60px !important;
    line-height: 60px !important;
}

.leaflet-top, .leaflet-bottom{
    z-index: 600 !important;
}

video{
    max-width: 800px;
}

.videobox{
    display: flex;
    justify-content: center;
}

.introtext{
    text-align: center;
    width: 50%;
}

.imageShowcase{
    display: flex;
    justify-content: space-between;
    margin-bottom: 150px;
    margin-top: 50px;
}

.imageShowcase img{
    width: 350px;
    margin-top: 50px;
}

.introduction h1{
    /*color: #1169B0;*/
    font-weight: 800;
    padding-top: 50px;
    padding-left: 20px;
}

.introduction h2{
    color: black;
    /*text-align: center;*/
    font-weight: 300;
    padding-left: 20px;
}

.introduction h3{
    color: #1169B0;
    text-align: center;
    font-weight: 300;
    font-size: 1.5rem;
}

.introduction .circle{
    height: 200px;
    width: 200px;
    background-color: #EF7F1A;
    border: 1px solid #EF7F1A;
    border-radius: 50%;
    display: grid;
    align-items: center;
}

.introduction .circle h4{
    color: white;
    margin-right: 23px;
    font-weight: 300;
    text-align: center;
    margin-top: 30px;
    margin-left: 18px;
    font-size: 15px;
}

.circleShowcase{
    display: flex;
    justify-content: space-around;
    margin-bottom: 30px;
}

.circleShowcaseSingle{
    display: flex;
    justify-content: center;
}

.circleWrap{
    display: block;
    margin-top: 45px;
    margin-bottom: 45px;
}


.cardShowcase{
    display: flex;
    justify-content: space-around;
    padding-bottom: 100px;
}

.infoCard{
    width: 270px;
    background-color: white;
    border: 1px solid #1169B0;
    height: 300px;
    display: grid;
    align-items: center;
    border-radius: 15%;
}

.infoCard h4{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-weight: 600;
    color: #505050;
}

.buttonTab{
    display: flex;
    justify-content: space-around;
    margin-bottom: 50px;
}

.cta{
    width: 300px;
    background-color: #1169B0;
    border: 1px solid #1169B0;
    height: 75px;
    display: grid;
    align-items: center;
    display: grid;
    justify-content: center;
    align-items: center;
    transition: 0.2s ease-out;
    cursor: pointer;
    margin-left: auto;
    margin-right: auto;
}

.cta:hover{
    background-color: white;
    transition: 0.2s ease-out;
}

.cta:hover > h4{
    color: #1169B0;
    transition: 0.2s ease-out;
}

.cta h4{
    color: white;
    transition: 0.2s ease-out;
    line-height: 70px;
    cursor: pointer;
    font-weight: 700;
}

.cta2{
    width: 450px;
    background-color: #1169B0;
    border: 1px solid #1169B0;
    height: 75px;
    display: grid;
    justify-content: center;
    align-items: center;
    transition: 0.2s ease-out;
    cursor: pointer;
    margin-left: auto;
    margin-right: auto;
    margin-top: 120px;
}

.cta2:hover{
    background-color: white;
    transition: 0.2s ease-out;
}

.cta2:hover > h4{
    color: #1169B0;
    transition: 0.2s ease-out;
}

.cta2 h4{
    color: white;
    transition: 0.2s ease-out;
    line-height: 70px;
    cursor: pointer;
    font-weight: 700;
}

.cta3{
    width: 450px;
    background-color: #1169B0;
    border: 1px solid #1169B0;
    height: 75px;
    display: grid;
    align-items: center;
    display: grid;
    justify-content: center;
    align-items: center;
    transition: 0.2s ease-out;
    cursor: pointer;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 120px;
}

.cta3:hover{
    background-color: white;
    transition: 0.2s ease-out;
}

.cta3:hover > h4{
    color: #1169B0;
    transition: 0.2s ease-out;
}

.cta3 h4{
    color: white;
    transition: 0.2s ease-out;
    line-height: 70px;
    cursor: pointer;
    font-weight: 700;
}



.optionCard{
    width: 370px;
    background-color: #1169B0;
    border: 1px solid white;
    height: 500px;
    display: grid;
    border-radius: 15%;
}

.optionCard h4{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    font-weight: 600;
    color: white;
}

.optionCard a{
    color: white;
    text-decoration: underline;
}

.optionCard a{
    color: white;
    text-decoration: underline;
}

.optionCard a:hover{
    color: #EF7F1A;
}

.featuresTab h1{
    padding-left: 20px;
    padding-top: 50px;
}

.genericTitle{
    margin-top: 50px;
    margin-bottom: 50px;
    color: #1169B0;
    font-weight: 600;
}

@media (max-width: 799px){
    .imageShowcase{
        flex-direction: column;
        align-items: center;
    }
    .introtext{
        width: 100%;
    }
    .circleShowcase, .cardShowcase{
        flex-direction: column;
        align-items: center;
    }
    .cta2{
        width: 300px;
        height: 90px;
        line-height: 0px;
    }
    .cta2 h4{
        line-height: normal;
        text-align: center;
        margin-top: 20px;
    }
}

@media (max-width: 500px){
    .bb-single-icon .mobile-logo-wrapper{
        display: flex;
        justify-content: flex-end;
        font-size: 15px;
        margin: 0;
        padding: 0;
    }
    .site-title{
        font-size: 15px;
    }
}

@media (max-width: 320px){
    .bb-single-icon .mobile-logo-wrapper{
        display: none;
    }
}