/*MYACCOUNT NEOGRIDS*/

/*use this one*/
:root {
    --primary-text-color: white !important;
    --primary-color: #1A6AFF !important;
    --primary-background-color: #1A6AFF !important;
    --secondary-color: #1A94E9 !important;
    --secondary-background-color: #1A94E9 !important;
    --selected-color: #1A6AFF !important;
    --selected-background-color: #f0f0f0 !important; 
    --link-color: #1A6AFF !important;
    --link-hover-color: #1A6AFF !important;
    --footer-text-color: #ffffff !important;
    --footer-background-color: #000E28 !important; 
    --unselect-color: #f8f8f8 !important;
    --unselect-background-color: #f8f8f8 !important;
    --font-family: 'Open Sans', sans-serif;
    --header-background-color: #FFFFFF !important;
    --header-color: #333 !important;
    --fixed-navbar-background-color: rgb(255 255 255 / 50%) !important;
    --body-line-height: 20px !important;
    --body-font-size: 14px !important;
    --paragraph-font-size: 14px !important;
    --label-font-size: 14px !important;
    --h1-font-size: 2rem !important;
    --h2-font-size: 1.5rem !important;
    --h3-font-size: 1.375rem !important;
    --h4-font-size: 1.25rem !important;
    --h5-font-size: 1.125rem !important;
    --h6-font-size: 1rem !important;
    --mobile-body-font-size: 14px !important;
    --mobile-paragraph-font-size: 14px !important;
    --mobile-label-font-size: 14px !important;
    --mobile-h1-font-size: 2.5rem !important;
    --mobile-h2-font-size: 2rem !important;
    --mobile-h3-font-size: 1.9rem !important;
    --mobile-h4-font-size: 1.8rem !important;
    --mobile-h5-font-size: 1.7rem !important;
    --mobile-h6-font-size: 1.5rem !important;
    --body-background-image: none !important;
    --body-background-color: transparent !important;
    --main-content-background-color: transparent !important;
    --main-content-color: #333 !important;
    --utilmate-container-width: 60% !important;
    --pane-background-color: #ffffff !important;
    --pane-color: #333 !important;
    --pane-border-color: none !important;
    --pane-border-radius: 2px !important;
    --pane-padding:  1rem !important;
    --banner-textbox-size: 50% !important;
    --max-logo-width: 200px!important;
}

@media (max-width: 400px){
    .navbar .brand{
        max-width: 160px;
    }
}

/* HOME page */
.connecting-is-easy-banner{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--secondary-background-color);
}
.connecting-is-easy-banner > div{
    width: 100%;
}

@media (min-width: 30em){
    .connecting-is-easy-banner{
        justify-content: end;
    }

    .connecting-is-easy-banner > div{
        width: 50%;
    }
}
/* HOME page */
.text-white{
    color: #ffffff;
}
.text-cyan{
    color: #1ACBCB;
}
.text-lightGreen{
    color: #1AFFAF;
}
.utilmate-list-link {
    border: 2px solid rgb(230, 234, 241) !important;
}
.utilmate-list-link:hover {
    background-color:  rgb(26, 106, 255, .2) !important;
}
.utilmate-list-link img{
    width: 2.2rem;
}
.utilmate-link-icon img{
    width: 2.5rem;
}
.utilmate-link-icon:hover {
    background-color:  rgb(26, 106, 255, .2) !important;    
}