body {
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    color: #363C41;
}

body, p, h1 {
    margin: 0;
}

#main-cont {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #CCE4E6;
    height: 100vh;
}

#calculator {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: var(--calc-width);
    height: var(--calc-height);
    background-color: #abc5e8;
}

.view-cont {
    display: flex;
    
    flex-direction: column;
    flex-wrap: wrap;

    justify-content: space-around;

    max-width: var(--calc-width);
    width: var(--calc-width);
    height: var(--view-height);
    padding: 15px 0px;
}

.btns-cont {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 20px;
    
    width: var(--calc-width);
    height: var(--btn-height);
}

.view-cont {
    box-shadow: 0px 5px 10px -5px #CDE2F8;
}

.btns-cont {
    box-shadow: 0px 20px 10px -5px #59748C;
}

#footer {
    text-align: center;
}

/* Borders */
#calculator,
.view-cont {
    /*border: 2px solid #9AAECB;*/
    border-radius: 20px;
}

/* CASIO & battery*/
.view-header {
    max-height: var(--view-hdr-height);
    margin-bottom: 7.5px;
    padding: 0px 20px;
}

#calc-name {
    font-size: 30px;
    font-weight: bolder;
}

/*
#calc-batt {
    width: var(--batt-width);
    height: 34px;
    background-color: #363C41;

    /* Put into grp later
    border-radius: 10px;
    box-shadow: 0px 5px 10px -5px #59748C;
    opacity: 0.8;
}
*/

.calc-btn,
.dark-calc-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--calc-btn-width);
    height: var(--calc-btn-height);
    border-radius: 10px;
    font-size: 20px;
}

.calc-btn {
    background-color: #AFC3DE;
    box-shadow: 0px 0px 2.5px #3E556F;
}

.dark-calc-btn {
    background-color: #8BAED4;
    box-shadow: 0px 0px 2.5px rgb(104, 130, 162);
}

.view-screen {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    flex-direction: column;

    max-width: inherit;
    max-height: var(--view-scrn-height);

    border-radius: 20px;
    padding: 0px 20px;
}

#inner-screen {
    display: flex;
    
    flex-direction: column;

    justify-content: space-evenly;
    align-items: flex-end;
    
    /*height: inherit;*/
    height: var(--view-scrn-height);
    
    border-radius: inherit;
    background-color: #CFE4E1;
    padding: 0px 16px;

    max-width: 500px;
}

#result {
    font-size: var(--res-fs);
    word-break: break-all; 
}

#calculation {
    font-size: var(--calc-fs);
    word-break: break-all; 
}

#calculation,
#result {
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

#footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    gap: 5px;
    background-color: #363C41;
    color: #CCE4E6;
} 

#footer-icon {
    width: 16px; 
    height: 16px;
    filter: invert(100%);
}