﻿/*
Theme Name: Storefront Child
Version: 1.0.0
Description: Storefront Child Theme
Author: Jacob Maupin
Template: storefront
*/


.logo-container{
    z-index:2999;
}
@media (min-width: 768px) {
    .mobile_margin_top_adjust {
        margin-top:60px;
    }
}

summary::before, ::marker {
    display: none; /* Hides the ::before pseudo-element */
}
summary {
    font-size: 2em;
    line-height: 1.214;
    color: #333;
    font-weight: 700;
    list-style-type: none;
}

summary::-webkit-details-marker {
    display: none; /* Hides the default marker */
}

summary::before {
    content: ""; /* Unicode character for plus sign */
    display: inline-block;
    margin-right: 5px; /* Adjust the space between the text and the marker */
}
    summary::after {
        float:right;
        content: "\25B6"; /* Unicode character for plus sign */
        display: inline-block;
        margin-left: 15px; /* Adjust the space between the text and the marker */
    }
details p {
    padding-left: 5px;
    padding-top:10px;
}
h4 {
    font-size: 28px;
    font-weight:700;
}
.entry-content .stk-block, .stk-block, .stk-block-column__content > * {
    margin-bottom: 0px;
}
.stk-container {
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.33) !important; /* Applying box shadow */
}

details[open] summary::before {
    content: ""; /* Unicode character for minus sign */
}

details[open] summary::after {
    content: "\25BC"; /* Unicode character for minus sign */
}












.single-post .entry-meta .entry-categories {
    display: none;
}
.right-menu-class .sub-menu {
    display: none;
    position: absolute;
    padding-top: 15px;
    padding-bottom: 10px;
}
.submenu menu-item {
    margin-left: 0px;
    margin-right: 0px;
    margin: 0 0px !important;
}
.right-menu-class .sub-menu li {
    display: block !important;
}

        .right-menu-class .sub-menu li a {
            padding-left: 0px;
            margin-left: 0px;
            padding-left: 16px;
            padding-right: 16px;
        }

/* Show submenu on hover */
.right-menu-class .menu-item-has-children:hover > .sub-menu {
    display: block;
}

/* Styling for submenu items */
.right-menu-class .sub-menu li {
    padding: 10px;
    text-align: left;
}


#menu-item-211 {
    margin: 0 10px;
}

.right-menu-class ul ul {
    margin: 0px;
    margin-left: 13px;
}

.right-menu-class .sub-menu {
    margin-left: 211px;
}

.right-menu-class .sub-menu li {
    background-color: white;
}



/* Custom Blog Page CSS */
.post-summary {
    margin-bottom: 100px;
    display: flex; /* Use flexbox */
    align-items: center; /* Center vertically */
}

.post-thumbnail {
    width: 250px; /* Adjust width as needed for larger images */
    height: 150px; /* Adjust height as needed for larger images */
    margin-right: 20px;
    background-size: cover;
    background-position: center;
    flex: 0 0 auto; /* Prevent the image from growing */
}

.post-content {
    flex: 1; /* Expand to fill remaining space */
}

.post-title {
    font-size: 20px;
    margin-top: 0;
    font-weight:700;
}

.post-excerpt {
    margin-bottom: 10px;
}

.read-more {
    display: block;
    margin-top: 10px;
    color: #333;
    text-decoration: none;
}

.pagination {
    margin-top: 20px;
}

/* Responsive Design for Mobile */
@media screen and (max-width: 768px) {
    .post-thumbnail {
        width: 100%;
        height: 250px;
        margin: 0 0 .5407911001em;
    }
    .post-summary {
        display: block; /* Use flexbox */
    }

}






.post-thumbnail-large {
    text-align: center;
    margin-bottom: 20px; /* Adjust margin as needed */
}

    .post-thumbnail-large img {
        width: auto; /* Allow the image to be displayed at its original size */
        max-width: 100%; /* Ensure the image doesn't exceed its container's width */
        height: auto; /* Maintain aspect ratio */
        max-height:250px;
    }

.entry-taxonomy{
    display:none !important;
}






.pagination {
    margin-top: 20px;
    text-align: center;
    border:0px;
}

    .pagination a,
    .pagination span {
        display: inline-block;
        padding: 5px 12px; /* Increased padding */
        margin: 0 5px;
        background-color: #f9f9f9;
        color: #333;
        text-decoration: none;
        border-radius: 3px;
    }

    .pagination .current {
        background-color: #333;
        color: #fff;
    }

    .pagination a:hover,
    .pagination span:hover {
        background-color: #ddd;
    }

    .pagination a {
        text-decoration: none !important; /* Remove text underline */
    }




body.page-id-185, body.page-id-179, body.single-post {
    background-color: #f8f8f8 !important;
}
p + h2 {
    margin-top: 50px;
}
input[type="date"] {
    text-align: left;
    -webkit-appearance: textfield; /* Override Safari's default appearance */
    appearance: textfield; /* Override other browser's default appearance */
}

.social-icons-container2 {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .social-icons-container2 > div {
        flex: 1;
        text-align: center;
    }
    .social-icons-container2 a{
        color:#333;
    }

    .about_me_heading {
        font-size: 120px;
    }
@media (max-width: 767px) {
    .about_me_heading {
        font-size: 100px;
    }
}

.dropdown-toggle {
    width: 100%;
    text-align: right;
    color: white !important;
}

@media (max-width: 767px) {
    .separate_JM, .separate_JM2 {
        margin-top: 30px !important;
        margin-bottom: 30px !important;
    }
    .separate_JM2:last-child {
        margin-bottom: 0px !important;
    }
}
@media (min-width: 768px) {
    .adjuster_JM {
        margin-top: 75px;
    }
}
.column-container {
    gap: 0px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
}
    .column-container .wp-block-column {
        margin-right: 0px !important;
        padding-top:25px !important;
        padding-bottom:30px !important;
        padding-left:20px !important;
        padding-right:20px !important;
    }
        .column-container .wp-block-column p{
            margin-bottom:0px;
        }

.back-background-column {
    background-color: black !important;
    color: white;
    background-size: cover; /* Cover the entire container */
    background-position: center; /* Center the background image horizontally and vertically */
    background-repeat: no-repeat;
}
.hover_container { 
    border-top-right-radius: 40px;
    border-bottom-left-radius: 40px;
    overflow:hidden;
    width:100%;
    max-width:100%;
    
}
.inner-background {
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 175px;
    transition: transform .3s ease;
}
    .inner-background:hover {
        transform: scale(1.1);
    }

.mkd-separator-with-icon-holder{
    text-align:center;
}
.grey-background {
    background-color: #f8f8f8;
}

.left-menu-class .sub-menu {
    display: none;
    position: absolute;
    padding-top: 30px;
    padding-bottom: 10px;
}
    .left-menu-class .sub-menu li {
        display: block !important;
    }

        .left-menu-class .sub-menu li a {
            padding-left: 0px;
            margin-left: 0px;
            padding-left: 16px;
            padding-right: 16px;
        }

/* Show submenu on hover */
.left-menu-class .menu-item-has-children:hover > .sub-menu {
    display: block;
}

/* Styling for submenu items */
.left-menu-class .sub-menu li {
    padding: 10px;
    text-align: left;
}


.left-menu-class .menu-item li:last-child {
    margin-left: 10px !important;
}

.left-menu-class ul ul{
    margin:0px;
    margin-left:13px;
}

.left-menu-class .sub-menu {
    margin-left: 5px;
}




.home .left-menu-class .sub-menu li,
.page-id-206 .left-menu-class .sub-menu li,
.page-id-212 .left-menu-class .sub-menu li,
.page-id-208 .left-menu-class .sub-menu li,
.page-id-210 .left-menu-class .sub-menu li {
    background-color: rgba(0,0,0, .3);
}

.left-menu-class .sub-menu li {
    background-color: #1d1d1d;
}















.social-icons-container2 img {
    max-width: none;
}
.site-footer {
    padding: 1.618em 0 1.618em;
}
input[type=date] {
    padding: 0.6180469716em;
    text-align:left;
}
    body {
    font-family: 'barlow-regular', 'serif';
    font-size: 18px;
}
.equal_containers{
margin-top:70px; 
margin-bottom:70px;
}
.alignfull, :where(.wp-block-columns) {
    margin-bottom: 0px;
}
a:visited, a:focus, button:visited, button:focus {
    outline: none !important;
    text-decoration: none !important;
}
@media (min-width: 768px) {
    .col-full {
        max-width: 1240px;
        margin-left: auto;
        margin-right: auto;
        padding: 0 2.617924em;
        box-sizing: content-box;
    }
}

.hentry {
    margin: 0px;
}
.site-main {
    margin-bottom: 0px;
}
@media (min-width: 768px){
   .content-area, .widget-area{
       margin-bottom: 0px;
   }
}
.site-info{
    display:none;
}

.edit-link {
    display: none;
}
/*****************/
/*****BUTTONS*****/
/*****************/
.basic-button {
    background-color: rgba(29, 29, 29, 1);
    color: white;
    padding: 10px 20px;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease; /* Smooth transition for the background color change */
    text-decoration: none !important;
}
.basic-button:hover {
    background-color: rgba(29, 29, 29, .8); /* Red color with 80% opacity when hovered */
}

/******************************/
/******SOCIAL MEDIA ICONS******/
/******************************/

.social-icons-container {

    padding-top:10px;
    display: flex;
    top: -16px;
}
.social-icons-container2 {
    display: none;
}

    @media (max-width: 782px) {
        .main-navigation ul li a {
            color: #333;
         
        }
        .menu{
            display:block!important;
       
        }
        .nav-menu{
            display:none;
        }
        .handheld-navigation ul li:first-child {
           /* margin-top: 25px;*/
        }

        #menu-item-297{
            margin-top:0px !important;
        }

        #masthead {
       
        }
    }



@media (max-width: 1340px){
    .social-icons-container2 {
        display: flex;
        top: 20px;
    }
    .go_away_mobile {
        display: none;
    }
} 







    .social-icons {
    width: 26.5px;
    height: 26.5px;
    margin-right: 10px;
    background-color: #4f4f4f;
    padding: 4px;
}
.social-icons:hover{
    background-color:#464646;
}

/*******************************/
/* ABOUT PAGE SECTION 1 STYLES */
/*******************************/

.about_page_section1 {
    display: flex;
}
.even-column {
    flex: 1; 
}
.even-column:nth-child(2) {
    display: flex;
    align-items: center; /* Center vertically */
}
.inner-flex-padding {
    padding: 90px;
    color: #1d1d1d;       
    background-color:rgba(252,252,252,1);
    box-shadow: 0 0 25px 0 rgba(0,0,0,.11);
}
.inner-flex-padding p {
    padding-bottom: 20px;
} 
@media (max-width: 768px) {
    .inner-flex-padding {
        padding: 30px;        
    }
    .about_page_section1 {
        display: block;
    }
}

/*****************************/
/******    MASTHEAD    *******/
/*****************************/

#masthead {
    width: 100%;
    margin-bottom: 0px;
    background-color: white;
}
.home #masthead{
    background-color: rgba(0,0,0,.2);
    margin-bottom: 0px;
    background-color: white;
}
@media (min-width: 768px) {
    .home #masthead {
        /*position: absolute;*/
        background-color: white;
    }    
    #masthead .col-full {
        display: flex;
        align-items: center;
    }    
    #masthead .main-navigation {
        text-align: right;
    }
}

.column-full-grey-background{
     background-color:#f8f8f8;
}

































.menu-item a {
    font-size: 24px;
}

    .responsive_add_remove_padding img {
        padding: 20px !important;
    }

    @media (max-width: 782px) {
        .responsive_add_remove_padding img {
            padding: 0px !important;
            padding-bottom: 20px !important;
        }
        .site-header .custom-logo-link img {
            max-width: 85px!important;
        }
    }

    @media (min-width: 782px) {
    }

    .menu-item a {
        padding: 0.5rem 0.5rem;
        color: #333;
    }

    .site-header {
        
    }


    .menu-item a:hover {
        opacity: .7;
    }

    @media (min-width: 768px) {
        nav .menu, .site-branding {
            display: none !important;
        }
    }

    @media (max-width: 768px) {
        .nav-right, .logo-container {
            display: none !important;
        }

        .nav-left {
            display: none !important;
        }

        .menu-item a {
            font-size: 18px;
        }
    }








    .menu {
        list-style: none;
        display: flex;
        align-items: center; /* Center vertically */
        justify-content: center; /* Center horizontally */
    }

    .menu-item {
        margin: 0 0px; /* Optional: Add margin between menu items */
    }

    .right-menu-class ul {
        margin: 0 3em 0em 0;
    }


    .left-menu-class ul {
        margin: 0 0 0 3em;
    }





    @media (min-width: 768px) nav .menu, .site-branding { {
    display: none !important;
}}


/* Center the logo and align the navigation menus */
/* Center the logo and align the navigation menus */
.header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo-container {
    flex: 1;
    text-align: center;
    max-width: 110px !important;
    margin-top: 10px;
    margin-bottom: 10px;
}

    .logo-container .custom-logo {
        max-width: 100%;
    }

.nav-left,
.nav-right {
    flex: 1;
    display: flex;
    justify-content: space-between;
}

.left-menu-class,
.right-menu-class {
    list-style: none;
    padding: 0;
}

    .left-menu-class li {
        display: inline;
        margin-right: 0px; /* Adjust the spacing between menu items */
      
    }

    /* Align text to the right within the right menu */
    .right-menu-class li {
        display: inline;
        margin-left: 0px; /* Adjust the spacing between menu items */
    }


        .right-menu-class li:first-child{
            margin-right:0px;
        }
        .left-menu-class li:first-child {
            margin-left: 10px;
        }
    .left-menu-class li:last-child {
        margin-left: 0px;
    }
        /* Align the content inside the nav-right container to the right */
        .nav-right {
            display: flex;
            justify-content: flex-end; /* Align content to the right */
            align-items: center; /* Vertically center content */
        }
/* Apply margin to the left side of ul in the left menu */


/* Apply margin to the right side of ul in the right menu */



.menu-item {
    font-weight: 600;
}

    .menu-item a {
        padding: 0.5rem 0.5rem;
        padding-left: 20px;
        padding-right: 20px;
        font-size: 18px;
        text-transform: uppercase;
        letter-spacing: 2px;
    }



.main-navigation div.menu {
    display: none
}









@media (min-width: 768px) {
    .woocommerce-active .site-header .main-navigation {
        width: 50%;
        float: left;
        margin-right: 0%;
        clear: both;
    }
}

@media (min-width: 768px) {
    .woocommerce-active .site-header .site-branding {
        float: left;
        margin-right: 0px;
    }



    .home.blog .site-header,
    .page-id-206.blog .site-header,
    .page-id-212.blog .site-header,
    .page-id-208.blog .site-header,
    .page-id-210.blog .site-header,
    .home.page:not(.page-template-template-homepage) .site-header,
    .page-id-206.page:not(.page-template-template-homepage) .site-header,
    .page-id-212.page:not(.page-template-template-homepage) .site-header,
    .page-id-208.page:not(.page-template-template-homepage) .site-header,
    .page-id-210.page:not(.page-template-template-homepage) .site-header,
    .home.post-type-archive-product .site-header,
    .page-id-206.post-type-archive-product .site-header,
    .page-id-212.post-type-archive-product .site-header,
    .page-id-208.post-type-archive-product .site-header,
    .page-id-210.post-type-archive-product .site-header 
    {
        margin-bottom: 0px !important;
    }



    .site-branding {
        max-width: 50% !important;
        padding-top: 0px !important;
        margin-bottom: 0px;
    }
}





.site-header .site-logo-anchor img, .site-header .site-logo-link img, .site-header .custom-logo-link img {
    max-width: 155px;
}

 


    @media (min-width: 768px) {




        .site-header .site-branding img {
            height: auto;
            max-width: 190px;
            max-height: none;
        }
    }

    @media (min-width: 768px) {
        .site-header {
            padding-top: 0px;
        }
    }

    .primary-navigation {
    padding-top: 25px;
    padding-bottom: 25px;
}

@media (min-width: 768px){ 
    .storefront-secondary-navigation .site-header .site-branding {
    margin-right: 0px;
}}


.handheld-navigation a, .primary-navigation a {
    color: #333 !important;
}

    .handheld-navigation a:hover, .primary-navigation a:hover {
        color: #b6b6b6 !important;
    }






.handheld-navigation #menu-item-338 li a {
    padding: 10px !important;
}

.handheld-navigation #menu-item-217{
    margin-top:0px !important;
}




.main-navigation ul.menu > li > a, .main-navigation ul.nav-menu > li > a, .main-navigation ul.menu > li > a:hover, .main-navigation ul.nav-menu > li > a:hover, .site-header ul.menu li.current-menu-item > a {
    font-style: normal;
    font-size: 18px;
    line-height: 22px;
}

.entry-header{
    display:none;
}



.site-header {
    border-bottom: 0px;
}


#site-navigation-menu-toggle {
    margin-top: 14px;
}


@media (min-width: 600px){ 
    .hentry .entry-content .wp-block-columns .wp-block-column, .editor-styles-wrapper .wp-block-columns .wp-block-column {
    padding-left: 0;
    padding-right: 0px;
    margin-left: 0;
    }
.video-height-adjust{
    height:100vh; 
    overflow:hidden;
}
}



@media (max-width: 767px) {
    .video-height-adjust video {
        width: 125%; /* Adjust the value as needed to zoom in */
        height: auto;
    }
    embed, iframe, object, video {
        max-width: 125%;
    }
    .hentry .entry-content .wp-block-video video, .editor-styles-wrapper .wp-block-video video {
        width: 125%;
    }
}




.site-footer {
    background-color: #1d1d1d;
}









.JM_feature_section_container {
    display: flex;
    padding:20px;
}

.JM_feature_section_column{
   width:50%;
   float:left;
}
.JM_feature_section_right-column{
    padding-left:40px;
}
.JM_feature_section_left-column {
    padding: 0px 20px;
}
.JM_feature_section_heading{
    margin-top:40px;
}
.wavy_alignment{
    margin: 0 0 20px;
}
@media (max-width: 768px) {
    .JM_feature_section_container {
        display:block;
    }
    .JM_feature_section_column {
        width: 100%;
    }
    .JM_feature_section_right-column {
        padding-left: 0px;
        text-align:center;
    }
    .JM_feature_section_left-column{
        padding:0px;
    }
    .wavy_alignment {
        margin: 0 auto;
    }
}




.hentry .entry-content .wp-block-columns .wp-block-column, .editor-styles-wrapper .wp-block-columns .wp-block-column {
     margin-bottom: 0px;
}



















.image-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0; /* Remove default padding */
    max-width: 100%; /* Set a maximum width for the grid */
}

.image-item {
    flex-basis: 25%; /* Four columns */
    margin: 0; /* Remove margin */
    position: relative; /* Position relative for aspect ratio */
    overflow: hidden; /* Hide overflow */
    display: flex; /* Center image vertically and horizontally */
    align-items: center;
    justify-content: center;
}

    .image-item img {
        width: 100%; /* Ensure image fills container */
        height: 100%; /* Ensure image fills container */
        object-fit: cover; /* Maintain aspect ratio */
        display: block;
    }

    /* Set aspect ratio */
    .image-item:before {
        content: "";
        display: block;
        padding-top: 100%; /* 1:1 Aspect Ratio (square) */
    }

@media screen and (max-width: 768px) {
    .image-item {
        flex-basis: 50%; /* Two columns on mobile */
    }
}












.mkd-separator-with-icon-holder.mkd-default-icon .mkd-separator-left {
    margin-right: 5px;
}

.mkd-separator-with-icon-holder.mkd-default-icon .mkd-separator-left, .mkd-separator-with-icon-holder.mkd-default-icon .mkd-separator-right {
    display: inline-block;
    height: 1px;
    opacity: .5;
    background-color: #4a3e5a;
    width: 39px;
}


.mkd-separator-with-icon-holder.mkd-default-icon .mkd-default-icon-holder {
    display: inline-block;
    background-color: #4a3e5a;
    height: 5px;
    width: 5px;
    position: relative;
    top: 2px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}

.mkd-separator-with-icon-holder.mkd-default-icon .mkd-separator-right {
    margin-left: 5px;
}

.mkd-separator-with-icon-holder.mkd-default-icon .mkd-separator-left, .mkd-separator-with-icon-holder.mkd-default-icon .mkd-separator-right {
    display: inline-block;
    height: 1px;
    opacity: .5;
    background-color: #4a3e5a;
    width: 39px;
}







.service_backgrounds {
    padding: 20px;
    background-color: #1d1d1d;
    border-radius: 10px;
}

.repair-padding-mobile{
    padding:0px;
}


.center-text-mobile {
    text-align: left;
}
@media screen and (max-width: 767px) {
    .center-text-mobile {
        text-align: center;
    }
    .repair-padding-mobile{
        padding:4px;
    }

    .service_backgrounds {
        border-radius: 0px;
    }
    .service_backgrounds:first-child {
        padding-top:50px;
    }

    /* Style for the last child */
    .service_backgrounds:last-child {
        padding-bottom:50px;
    }

    .wp-block-columns {
        display: flex;
        
    }

    .show-first .wp-block-column:nth-child(2) {
        order: -1;
    }

    .show-last .wp-block-column:nth-child(2) {
        order: 3 !important;
    }
}

.opening_feature :where(.wp-block-columns.is-layout-flex) {
    gap: 0em;
}




