.smallGrey,body,select,textarea{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;
    color:#000;
    font-size:14px;
    align-items: center;
}
#myHeaderLink,.tabulator,a,td{
    font-size:14px
}
#clientMessage {
    font-size: 18px; 
    font-weight: bold; 
    color: #ffffff; 
    background-color: #0073e6; 
    padding: 10px; 
    border-radius: 5px; 
    text-align: center;
}
#heading,#mainMenu{
    font-size:18px
}
#subMenu{
    font-size:14px;
    text-decoration:none;
    font-weight:700;
    color:#486bc6
}
@media (max-width:414px){
    #mainMenu,.smallGrey,a,body,input,select,td,textarea{
        font-size:12px!important;
        text-decoration:none;
        font-weight:700;
        color:#486bc6;
        align-items: center;
    }
    #subMenu{
        font-size:10px!important;
        text-decoration:none;
        font-weight:700;
        color:#486bc6
    }
    #heading{
        font-size:14px!important
    }
    #myHeaderLink{
        font-size:10px!important;
        text-decoration:none;
    }
    #summaryTable,.stripeMeAttach{
        width:100%!important
    }
    .flex-container{
        flex-direction:column!important;
        gap:10px
    }
    .tabulator{
        font-size:9px
    }
    #clientMessage {
        font-size: 14px; 
    }
}
@media (min-width:769px) and (max-width:1024px){
    #myHeaderLink,#subMenu,.smallGrey,.tabulator,a,body,input,select,td,textarea{
        font-size:14px
    }
    #subMenu,a{
        text-decoration:none;
        font-weight:700;
        color:#486bc6
    }
    #heading,#mainMenu{
        font-size:18px
    }
    #clientMessage {
        font-size: 18px; 
    }
}
@media (min-width:1025px){
    #myHeaderLink,.smallGrey,a,body,input,select,td,textarea{
        font-size:16px
    }
    #subMenu,a{
        text-decoration:none;
        font-weight:700;
        color:#486bc6
    }
    #heading,#mainMenu{
        font-size:24px
    }
    #subMenu{
        font-size:18px
    }
    .tabulator{
        font-size:14px
    }
}
@media (max-width:414px){
    #summaryChart, #graph1 {
        width: 360px;
        max-width: 360px;
        height: 180px;
    }
}
@media (min-width:415px) and (max-width:801px){
    #summaryChart, #graph1 {
        width:450px !important;
        height:225px !important;
    }
}
@media (min-width:801px) and (max-width:1370px){
    #summaryChart, #graph1 {
        width:540px !important;
        height:270px !important;
    }
}
@media (min-width:1371px) and (max-width:1600px){
    #summaryChart, #graph1 {
        width:670px !important;
        height:335px !important;
    }
}
@media (min-width:1601px) and (max-width:1890px){
    #summaryChart, #graph1 {
        width:800px !important;
        height:400px !important;
    }
}
@media (min-width:1891px){
    #summaryChart, #graph1 {
        width:870px !important;
        height:435px !important;
    }
}#summaryChart,#summaryTable{
    border-radius:4px;
    box-shadow:0 4px 8px rgba(0,0,0,.2);
    padding:15px;
    background-color:#fff;
}
#summaryChart:hover,#summaryTable:hover{
    box-shadow:0 6px 12px rgba(0,0,0,.3);
}
#summaryChart th,#summaryTable th{
    background-color:#486bc6;
    color:#fff;
    padding:8px;
    font-weight:700;
    border-radius:4px
}
input[type=radio]{
    appearance:none;
    width:12px;
    height:12px;
    border:.5px solid #666;
    border-radius:50%;
    background-color:#fff;
    display:inline-block;
    position:relative;
    vertical-align:middle;
    margin-bottom:3px
}
input[type=radio]:checked{
    background-color:#666;
    border:.5px solid #444
}
.ui-datepicker-trigger{
    vertical-align:middle;
    margin-top:3px
}
@keyframes pulse{
    0%,100%{
        opacity:1
    }
    50%{
        opacity:.5
    }
}
.login-instructions{
    animation:3s ease-in-out infinite pulse
}