_redesign_2023.scss 4.14 KB

#content-wrap {
    height: 8.75rem !important;
    transition: height 0.3s;
}


.sidebar {
    & > h2 {
        margin-top:0;
        font-size: 20px;
        text-transform: capitalize;
        margin-bottom:10px;
        font-family: "Helvetica-Bold";  
    }
}

article {
    & > h5 {
        margin-top:0;
    }
}

#brokercontent {
    padding-top:calc(8.75rem + 3.125rem);
}

.header-image {
    height: 16.875rem;
}

#page-content {
    padding-top:2.5rem;
}

.tab_menu {
    position: relative;
}

@media (min-width: 768px) {

    #brokercontent .col-sm-smallMenu .tab_menu:hover {
        filter: brightness(1.2);
    }

    #page-logo {
        #otherpage-logo {
            width: 12.5rem !important;
            transition: width 0.3s;
        }
    }

    #page-header-landing {
        max-width: 85.375rem;
        max-width: calc(85.375rem + 3.125rem);
        padding-left:3.125rem;
        height: 100%;
        max-height: 100%;
    }

    #other-header {
        height: 100%;
        & > .row {
            height: 100%;
            display: flex;
            & > div {
                height: 100%;  
                float: none;
                padding:0 !important;
                &:first-of-type {
                    align-items: center;
                    display: flex;
                }
            }
        }
    }

    .admin-bar {
        .col-sm-smallMenu {
            top:10.75rem!important;
        }
    }

    .page-template-broker_landing_page {
        .col-sm-smallMenu {
            top:0 !important;
        }
    }

    #content-wrap {
        padding:0;
    }

    #brokercontent {
        display: flex;
        flex-direction: column;
        margin-top:0;
        max-width: none;
        & > .row {
            max-width: 72.875rem;
            margin:0 auto;
        }
        & > .row:first-of-type {
            max-width: 100%;
            width: 100%;
        }
        .col-sm-smallMenu {
            display: flex;
            width: 100%;
            top:6.25rem;
            align-items: center;
            transition: 0.3s;
            .tab_menu {
                padding:0 !important;
                height: 3.125rem;
                margin-top:0;
                flex: 1;
                flex-grow: 1;
                display: flex;
                padding-right:0;
                align-items: center;
                & > img {
                    flex-basis: 20%;
                }
                &:focus {
                    transform: none;
                }
                &:hover {
                    transform: none;
                }
                &:first-of-type {
                    flex: 0;
                    flex-basis: 3.125rem;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    .tab_label {
                        display: none;
                    }
                }
                img {
                    width: 28px;
                    height: 28px;
                }
                .menu-graphic-wrap {
                    height:100%;
                    flex-basis:20%;
                    display:flex;
                    justify-content: center;
                    align-items: center;
                }
                .tab_label {
                    font-size: 0.75rem;
                    line-height: 0.875rem;
                    text-align: left;
                    margin: 0;
                    color:#000000;
                    align-items: center;
                    display: flex;
                }
            }
        }
    } 

    .admin-bar {
        #content-wrap.retract {
            height: 5.3125rem !important;
        }
    }

    body.retract {
        .col-sm-smallMenu {
            top:7.3125rem !important;
        }
    }

    #content-wrap.retract {
        #page-logo {
            #otherpage-logo {
                width: 8.75rem !important;
            }
        }
    }
  
  }
  
  #page-content {
    max-width: 1166px;
    width: 100%;
    position: relative;
    .col-sm-smallMenu {
        width: 100%;
    }
  }
  
  .col-sm-smallMenu {
    display: flex;
    transform: none !important;
    left:0;
  }