/* heights */
html {
    height:100%;
}
body {
    min-height:100%;
}
/* font family*/
html, body, h1, h2, h3, h4, h5, h6 {
    font-family: Roboto, sans-serif;
}
/* font weight */
h1, h2, h3, h4, h5, h6 {
    font-weight: lighter;
}
/* scalable font sizes for normal screens */
@media screen and (min-width:601px){
    h1 {font-size: 2.25em;}
    h2 {font-size: 1.875em;}
    h3 {font-size: 1.5em;}
    h4 {font-size: 1.25;}
    h5 {font-size: 1.125em;}
    h6 {font-size: 1em;}
    body, html {
        font-size: 0.9375em;
    }
    .i1 {font-size: 1.5em;}
    .i2 {font-size: 1.25em;}
    .i3 {font-size: 1em;}
    .i4 {font-size: 0.8333;}
    .i5 {
        position: relative;
        font-size: 1.6875em;
        vertical-align: 0.5em;
        top:0.39375em;
    }
    .i6 {
        position: relative;
        font-size: 1.5em;
        vertical-align: 0.5em;
        top:0.35em;
    }
    .i0 {font-size: 1.6em;}
}
/*scalable font sizes for small screens*/
/* @media screen and (max-width:600px){
    h1 {
        font-size: 4vw;
    }
    h2 {
        font-size: 3.5vw;
    }
    h3 {
        font-size: 3vw;
    }
    h4 {
        font-size: 2.5vw;
    }
    h5 {
        font-size: 2vw;
    }
    h6 {
        font-size: 1.5vw;
    }
    body, html {
        font-size: 2vw;
    }
} */
input:invalid {
    background-color: #ffdddd !important;
    -webkit-box-shadow: 0 0 0px 1000px #ffdddd inset !important; /* safari autofill*/
}
/*disable selection*/
.not-selectable {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
/* color classes */
.cstm-gray {
    color: white!important;
    background-color: #85969F;
}
.cstm-blue {
    color: white!important;
    background-color: #004E72;
}
.cstm-blue-font {
    color: #004E72;
}
/* opaque without child inheritance */
.opaque {
    background: rgba(255,255,255,0.5);
}
/* icons */
i {
    color: gray;
}
.icon-hover:hover {
    color: black;
    transition: 0.25s;
}
/* .material-icons {
    font-size: 2em;
} */
/* w3 container adjustments*/
.w3-modal-content.wide {
    max-width: 80%;
    width: auto;
}