/*
 Theme Name:   CE Theme v.2
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/*********** CE THEME - CUSTOM STYLES ***********/

/* Table of Contents:
 * 1 - Global Styles
 * 2 - Page Structure
 * 3 - Typography
 * 4 - Design Elements
        4A - Buttons
        4B - Sidebar
        4C - List Styling
        4D - Table Styling
        4E - Tabs
 * 5 - Header Area
 * 6 - Navigation
 * 7 - Custom Post Styling
 * 8 - Chat Feature
 * 9 - Ultimate Member Plugin Custom Styling
 * 10 - Footer
 */



/*///////////////////////////////////////////// 1. GLOBAL STYLES /////////////////////////////////////////////*/

body {
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    color:  #333;
    background-color: #fff;
}


/*///////////////////////////////////////////// 2. PAGE STRUCTURE /////////////////////////////////////////////*/

.separate-containers .site-main {
    margin-top: 0;
}

.elementor-widget:not(:last-child) {
    margin-bottom: 10px !important;
}

/* Hide Page Title */
header.entry-header {
    display: none;
}


/*///////////////////////////////////////////// 3. TYPOGRAPHY /////////////////////////////////////////////*/

h1.elementor-heading-title, h1 {
    font-size: 30px;
    line-height: 1.3;
    font-weight: 600;
}

h2.elementor-heading-title, h2 {
    font-size: 22px;
    line-height: 1.4;
    font-weight: 600;
}

h3.elementor-heading-title, h3 {
    font-size: 18px;
    line-height: 1.4;
    font-weight: bold;
}

h4.elementor-heading-title, h4 {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}

h5.elementor-heading-title, h5 {
    font-size: 20px;
    font-weight: 600;
    color: #639D36;
    background-color: #fff;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    top: -18px;
    display: inline;
    padding: 0 20px;
    
}

h6.elementor-heading-title, h6 {
    font-size: 15px;
    font-weight: normal;
    line-height: 1.45;
    margin-bottom: 15px;
}

p.elementor-heading-title, p {
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 15px;
}

.title-icon {
    margin-top: 10px;
    margin-right: 15px;
}

@media (max-width: 991px) {
    .title-icon {
        float: left;
    }
}


/***** Links *****/
a, a:link, a:active, a:visited, .elementor-heading-title a {
    color: #0079C1;
    font-weight: 600;
}

/* Hover */
a:hover, a:focus, a label:hover, a label:focus, 
.elementor a:hover, .elementor a:focus {
    color: #00a4e4;
}

.p-2 {
    padding: 20px;
}


/*///////////////////////////////////////////////////// 4. DESIGN ELEMENTS ///////////////////////////////////////////////////////*/


/*//////////////////////////////////////////// 4A: Buttons ////////////////////////////////////////////*/

a.elementor-button {
    font-size: 18px;
    border-radius: 0;
}


/* Default Button */
a.elementor-button-link.elementor-button {
    background-color: #639d36;
    color: #fff;
    font-size: 16px;
    padding: 17px 30px;
    font-weight: 500;
    border-radius: 3px;
}

a.elementor-button-link.elementor-button:hover,
a.elementor-button-link.elementor-button:focus {
    background-color: #7dca42;
}


/*********** Info Button ***********/
.elementor-element.elementor-button-info .elementor-button {
    background-color: #fff !important;
    border: 1px solid #639d36;
    color: #639d36;
    font-weight: 600;
    padding: 10px 20px;
}

.elementor-element.elementor-button-info .elementor-button:hover,
.elementor-element.elementor-button-info .elementor-button:focus {
    background-color: #639d36 !important;
    color: #fff;
}

@media (max-width: 767px) {
    a.elementor-button {
        width: 100%;
    }
}



/*//////////////////////////////////////////// 4B: Sidebar ////////////////////////////////////////////*/

.sidebar {
    background-color: #F6F6F6;
    padding: 5px 5px 0;
}

.sidebar h3 {
    font-size: 13px;
    color: #000;
    font-weight: 600;
    margin-bottom: -5px;
}

.sidebar p {
    font-size: 13px;
    margin-bottom: -5px;
}

.sidebar a {
    color: #0079C1 !important;
    font-weight: 600;
}

.sidebar .elementor-divider-separator {
    margin-top: 10px;
}

@media (max-width: 991px) {
    .sidebar {
        margin: 0 20px;
    }
}

@media (max-width: 767px) {
    .sidebar {
        margin: 0 15px;
        padding: 10px !important;
    }
}


/*//////////////////////////////////////////// 4B: List Styling ////////////////////////////////////////////*/

/************** Basic List Styling **************/
.elementor-container ul,
.elementor-container ol {
    margin-left: 20px;
}

.elementor-container ul li, 
.elementor-container ol li {
    margin: 0 0 12px;
    line-height: 1.4;
    font-size: 15px;
}

.elementor-container ul li ul {
    margin-top: 12px;
    display: block;
}


/************** Document Thumbnail Styling **************/
.row {
    display: flex;
}

.thumbnail {
    width: 20%;
    padding: 15px;
    font-size: 14px;
    float: left;
}

.thumbnail img {
    -webkit-box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%) !important;
    -moz-box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.2) !important;
    box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%) !important;
}

@media (max-width: 991px) {
   .thumbnail {
        width: 25%;
    } 
}

@media (max-width: 767px) {
   .thumbnail {
        width: 100%;
    } 
}


/*//////////////////////////////////////////// 4C: Table Styling ////////////////////////////////////////////*/

table {
    margin: 10px 0 25px;
}

table th, table td {
    border: 1px solid #ccc;
    padding: 10px;
    color: #000;
    font-size: 15px;
}

table th {
    background-color: #0073B1;
    font-weight: 500;
    border: 1px solid #006ba4;
    color: #fff;
    font-size: 16px;
    font-family: "Montserrat", sans-serif;
}

/* Fix for "Data Table" Styling */
@media (max-width: 767px) {
    .eael-data-table a {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}



/*//////////////////////////////////////////// 4D: Tabs ////////////////////////////////////////////*/


/* Tab titles */
.eael-advance-tabs .eael-tabs-nav ul li {
    background-color: #0079c1 !important;
    color: #fff !important;
    font-weight: 600;
    margin-bottom: 0;
}

.eael-advance-tabs .eael-tabs-nav ul li:hover, 
.eael-advance-tabs .eael-tabs-nav ul li:focus,
.eael-advance-tabs .eael-tabs-nav ul li.active:hover,
.eael-advance-tabs .eael-tabs-nav ul li.active:focus {
    color: #fff !important;
}

/* Active Tab */
.eael-advance-tabs .eael-tabs-nav ul li.active {
    background-color: #2f97d5 !important;
    color: #fff !important;
}

/* Content */
.eael-tabs-content {
    padding: 10px;
    border: 1px solid #bbb;
    border-top: 0;
}

@media (max-width: 1065px) and (min-width: 768px) {
    .mm-tabs .eael-tabs-nav li {
        min-height: 77px;
    }
}

@media (max-width: 767px) {
    .eael-advance-tabs .eael-tabs-nav ul li {
        width: 100%;
    }
}




/*///////////////////////////////////////////// 5. HEADER /////////////////////////////////////////////*/

/*********** Header Body ***********/
.inside-header.grid-container {
    padding-left: 40px;
    padding-right: 40px;
}

.site-header {
    background-color: #0079C1;
}

.inside-header {
    padding: 20px 0;
}

/*@media (min-width:  992px) {
    .site-header {
        top: 0;
        position: sticky;
        z-index: 1000;
    }
}*/


/*********** Logo ***********/
.site-header img {
    width: 160px;
}


/*********** Site title ***********/
.header-widget h1 {
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 0;
}


/*********** Hiding Featured image in title area ***********/
.featured-image.page-header-image.grid-container.grid-parent {
    display: none;
}


@media (max-width: 991px) {
    .inside-header.grid-container {
        padding: 15px 20px;
        display: flex;
        flex-direction: row;
    }

    .site-header .header-widget {
        margin: 0 0 0 auto;
        text-align: right;
    }
}

@media (max-width: 767px) {
    .site-header img {
        width: 100px;
    }

    .header-widget h1 {
        font-size: 14px;
    }
}


/*///////////////////////////////////////////// 6. NAVIGATION /////////////////////////////////////////////*/

/*********** Menu Body ************/
nav#site-navigation {
    border-bottom: 1px solid #cecece;
}

#primary-menu, .main-navigation li,
.main-navigation .main-nav ul li a {
    flex-grow: 1;
}

/*@media (min-width: 992px) {
    nav#site-navigation {
        top: 93px;
        position: sticky;
        z-index: 1000;
    }
}*/

/*********** Menu Item ***********/
.main-navigation .main-nav ul li a {
    font-size: 15px;
    line-height: 18px;
    transition: 0.3s;
    color: #0079C1;
    font-weight: 500;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}


@media (min-width: 769px) {
    .main-navigation .main-nav ul li {
        border-right: 1px solid #cecece;
    }

    .main-navigation .main-nav ul li:first-child {
        border-left: 1px solid #cecece;
    }
}


/*********** Selected, Hover & Focus ***********/
@media (min-width: 769px) {
    .main-navigation .main-nav ul li.current-menu-item a,
    .main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
    .main-navigation .main-nav ul li[class*="current-menu-"] > a,
    .main-navigation .main-nav ul li a:hover,
    .main-navigation .main-nav ul li a:focus {
        background-color: #2f97d5;
        color: #fff;
    }
}

/*********** Sub-Menu ***********/
.main-navigation ul ul {
    width: 100%;
    border-radius: 0 0 10px 10px;
    padding: 5px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.23);
    background-color: #fff;
}

.main-navigation .main-nav ul ul li a {
    font-size: 15px;
    text-transform: none;
    font-weight: normal;
    color: #000;
    justify-content: start;
    padding: 5px 10px;
    min-height: 40px;
}

/* Sub-Menu Toggle */
.menu-item-has-children ul .dropdown-menu-toggle span {
    padding: 10px 10px 0 10px;
}

/* Selected, Hover & Focus */
.main-navigation .main-nav ul ul li.current-menu-item a,
.main-navigation .main-nav ul ul li:not([class*="current-menu-"]):hover > a,
.main-navigation .main-nav ul ul li[class*="current-menu-"] > a,
.main-navigation .main-nav ul ul li a:hover,
.main-navigation .main-nav ul ul li a:focus {
    background-color: #fff;
    color: #639d36;
}

.main-navigation .main-nav ul ul li,
.main-navigation .main-nav ul ul li:first-child {
    border-right: none;
    border-left: none;
}


/*********** Mobile Menu ***********/
@media (max-width: 991px) and (min-width: 769px) {
    .main-navigation .main-nav ul li a {
        padding-left: 5px;
        padding-right: 5px;
    }

    .main-navigation .main-nav ul li a {
        text-transform: none;
    }

    .menu-item-has-children .dropdown-menu-toggle {
        padding-right: 0;
    }

    .main-navigation.toggled .main-nav ul ul.toggled-on {
        padding: 0;
        border-radius: 0;
    }
}

@media (max-width: 768px) {
    button.menu-toggle {
        width: 100%;
        text-align: left;
    }

    .main-navigation .main-nav ul li a, 
    .main-navigation .main-nav ul li.current-menu-item a {
        border-bottom: 1px solid #00598f;
        font-size: 17px;
        line-height: 2.75;
        padding: 0 20px;
        justify-content: start;
        background-color: #0079c1;
        color: #fff !important;
    }

    .main-navigation .main-nav ul li.current-menu-item a {
        background-color: #2796d8; 
    }

    .main-navigation.toggled .main-nav ul ul {
        border-bottom: none;
    }

    .main-navigation .main-nav ul ul li a {
        background-color: #2796d8;
        padding-left: 35px;
        font-size: 16px;
        text-transform: none;
        font-weight: normal;
    }

    .main-navigation ul ul {
        border-radius: 0;
        padding: 0;
    }

    .main-navigation .main-nav ul ul li.current-menu-item a,
    .main-navigation .main-nav ul ul li:not([class*="current-menu-"]):hover > a,
    .main-navigation .main-nav ul ul li[class*="current-menu-"] > a,
    .main-navigation .main-nav ul ul li a:hover,
    .main-navigation .main-nav ul ul li a:focus {
        background-color: #107abf;
        color: #fff;
    }
        
    .main-navigation .main-nav ul ul ul li a {
        padding-left: 60px;
    }

    span.gp-icon.icon-menu-bars, .menu-toggle .gp-icon+.mobile-menu {
        color: #0079c1;
        font-size: 17px;
    }
}




/*///////////////////////////////////////////// 7. CUSTOM POST STYLING /////////////////////////////////////////////*/

/*********** Post Body ***********/

body.single-post .container .content-area, 
body.single-post .container .widget-area section {
    background-color: #fff;
    margin-top: 25px;
}


/*********** Post Title ***********/

article.post .entry-header {
    display: block;
}

.navigation.post-navigation,
.post .entry-meta {
    display: none;
}

article.post .entry-header h1.entry-title {
    font-size: 36px;
    border-bottom: none;
    margin: 20px 0 0;
    padding-bottom: 0;
    font-weight: bold;
}


/*********** Post Text ***********/

article.post h2, article.post h3 {
    font-size: 22px !important;
}

article.post p {
    margin-bottom: 20px !important;
    font-size: 1rem !important;
}

article.post ol, 
article.post ul {
    margin-bottom: 25px;
}

article.post li {
    margin-bottom: 10px;
}


/*********** Recent Posts Sidebar ***********/

/* Widget Body */
.widget.widget_recent_entries {
    padding: 40px;
    margin-top: 25px;
    margin-left: 25px;
}

/* Widget Title */
.widget .widget-title {
    font-size: 17px !important;
    background-color: #0073B1;
    color: #fff;
    font-weight: bold;
    padding: 10px;
    margin: -10px -10px 10px;
}

/* Article Titles */
.sidebar .widget.widget_recent_entries a {
    text-decoration: none;
    margin-bottom: 15px;
    display: block;
}


@media (max-width: 768px) {
    body.single-post .container .content-area, 
    body.single-post .container .widget-area section {
        margin-top: 0;
    }

    .widget.widget_recent_entries {
        margin-left: 0;
    }
}


/*********** Related Posts ***********/

#jp-relatedposts .jp-relatedposts-items-visual h4.jp-relatedposts-post-title {
    margin-top: 5px;
}

#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a {
    font-weight: 700;
    font-size: 17px;
    color: #000;
    line-height: 1.4;
}

@media (max-width: 767px) {
    #jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post {
        width: 100%;
        padding-right: 0;
        margin-bottom: 30px;
    }
}



/*///////////////////////////////////////////////////// 8. CHAT FEATURE ///////////////////////////////////////////////////////*/

button.chat-button {
    background-color: #6ab7e4;
    width: 65px;
    height: 65px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    color: #fff;
    font-size: 0;
    border-radius: 100%;    
    -webkit-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.2);
    box-shadow: 6px 6px 15px 0px rgba(0,0,0,0.2);
}

button.chat-button::after {
    content: "\f27a";
    font-family: "Font Awesome 5 Free";
    font-size: 25px;
    font-weight: 900;
    position: absolute;
    top: 15px;
    left: 20px;
}

button.chat-button:hover {
    -webkit-box-shadow: 8px 8px 15px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 8px 8px 15px 0px rgba(0,0,0,0.25);
    box-shadow: 8px 8px 15px 0px rgb(0 0 0 / 25%);
    color: #fff;
}




/*///////////////////////////////////////////////////// 9. ULTIMATE MEMBER PLUGIN CUSTOM STYLING  ///////////////////////////////////////////////////////*/

/***********Buttons ***********/
.um input[type=submit].um-button, 
.um input[type=submit].um-button:focus, 
.um a.um-button, 
.um a.um-button.um-disabled:hover, 
.um a.um-button.um-disabled:focus, 
.um a.um-button.um-disabled:active {
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase !important;
    padding: 12px !important;
}

.um input[type=submit].um-button {
    background: #639d36 !important;
}

.um input[type=submit].um-button:hover, 
.um input[type=submit].um-button:focus {
    background: #7DCA42 !important;
}

/* Secondary Button */
.um .um-button.um-alt, .um input[type=submit].um-button.um-alt {
    background: #eeeeee;
    color: #333 !important;
}


/*********** Login Form Styling ***********/
.um-login a.um-link-alt {
    color: #666 !important;
}

/* Required asterisk */
.um span.um-req {
    color: #639d36 !important;
    margin-left: 5px;
}

/* ReCaptcha styling */
div.um .g-recaptcha {
    margin-bottom: 0 !important;
}


/*********** Password Reset Styling ***********/
.um-password div {
    color: #333;
}


/*********** Registration Form Styling ***********/

.um .um-field-label, 
.um .um-field-label label {
    margin-bottom: 0;
    color: #333;
}

.um-row-heading {
    font-weight: 600;
    font-size: 18px;
    font-family: "Montserrat", sans-serif;
    color: #333;
    padding-bottom: 5px;
}

.um .um-form input[type=text], 
.um .um-form input[type=search], 
.um .um-form input[type=tel], 
.um .um-form input[type=password], 
.um .um-form textarea {
    font-family: "Montserrat", sans-serif;
}

/* Hide Contractor ID field on Registration page */
.um-register .um-field-contractor_id {
    display: none;
}


/*********** User Name Styling ***********/

.header-profile-link a {
    color: #fff;
    text-transform: uppercase;
    font-size: 13px;
    font-family: "Montserrat", sans-serif;
}

.header-profile-link a:hover,
.header-profile-link a:focus {
    color: #fff;
}

.user-name-display {
    font-weight: 600;
    font-size: 26px;
    line-height: 1;
    font-family: "Montserrat", sans-serif;
    color: #333;
}


/*********** Profile Page Styling ***********/

.um-field {
    padding: 10px 0 13px !important;
}

.um a.um-link {
    color: #0079c1 !important;
}



/*********** Member Page Styling ***********/

.um-member-meta {
    margin-top: 0 !important;
}

/* Search button */
.um-do-search.um-button {
    background-color: #639d36;
    box-shadow: none;
    border-radius: 0 !important;
    padding: 12px 25px !important;
}

.um-do-search.um-button:hover,
.um-do-search.um-button:focus {
    background-color: #7DCA42;
}


/*********** Outreach Page Styling ***********/

.outreach-title {
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-size: 24px;
    font-weight: 600;
}

.outreach-email,
.outreach-phone {
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
}

.outreach-email {
    font-weight: bold;
}



/*///////////////////////////////////////////// 10. FOOTER /////////////////////////////////////////////*/

/*********** Footer Body ***********/
.footer-widgets-container.grid-container {
    max-width: 1200px;
}

.site-footer {
    /*margin-top: 70px;*/
    border-top: 10px solid #0079C1;
}

.footer-widgets-container {
    padding: 40px 0 60px;
}

/*********** Footer Text ***********/
.inside-footer-widgets p, 
.inside-footer-widgets a {
    font-size: 14px;
    line-height: 1.8;
}

.inside-footer-widgets a {
    text-decoration: none;
}


/* Social Icons */
.social-links .fab {
    width: 40px;
    height: 40px;
    font-size: 21px;
    margin: 25px 8px 0 0;
    border-radius: 100%;
    background-color: #929292;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    font-family: "Font Awesome 5 Brands";
}

.social-links .fab:hover,
.social-links .fab:focus {
    background-color: #0079C1;
}

.social-links .hidden {
    display: none;
}

/*********** Copyright Bar ***********/
footer.site-info {
    background-color: #fff;
    color: #333;
    border-top: 1px solid #eee;
}

.inside-site-info {
    padding: 20px 0;
    justify-content: center;
}

.copyright-bar, 
.site-footer:not(.footer-bar-active) .copyright-bar {
    margin: 0 !important;
}

/* Hide Generate Press text */
.copyright-bar, .copyright-bar a {
    color: #fff;
    font-size: 1px;
}

.copyright-bar span {
    color: #333;
    font-size: 13px;
}


/*********** Responsive ***********/
@media (max-width: 1250px) {
    .footer-widgets-container {
        padding: 50px 30px 100px;
    }

    .inside-site-info {
        padding: 20px 30px;
    }
}