﻿body {
    font-size: 1rem;
    font-weight: 400;
    /*font-family: 'Lora', serif;*/
    /*font-family:  Verdana, Geneva, Tahoma, sans-serif;*/
    font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    line-height: 150%;
    /*color: #333333;*/
    color: #4c4d4f;
}

select, button, input[type=text], input[type=password], input[type=number] {
    padding:10px;
    

    margin:0;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    
    border:1px solid darkGray;
    border-radius:10px;          
    
    font-size:1rem;        
    /*font-family: 'Lora', serif;*/
    font-family:  Verdana, Geneva, Tahoma, sans-serif;
}

p {
    margin-top:0;
    margin-bottom: 0;
    padding-bottom: 1rem;
}


.fs-tiny {
    font-size: .8rem;
}

.fs-tiny-small {
    font-size: .85rem;
}

.fs-small {
    font-size:.9rem;
}

.fs-small-medium {
    font-size:.95rem;
}

.fs-medium {
    font-size:1rem;
}

.fs-medium-large {
    font-size:1.1rem;
    line-height: 1.6rem;
}

.fs-large {
    font-size:1.2rem;
    line-height: 1.7rem;
}

.fs-large-huge {
    font-size:1.3rem;
    line-height: 1.8rem;
}

.fs-huge {
    font-size:1.8rem;
    line-height: 2.3rem;
}

.fs-gigantic {
    font-size: 3rem;
    line-height: 3.5rem;
}

.fw-thin {
    font-weight: 200;
}

.fw-thin-medium {
    font-weight:300;
}

.fw-medium {
    font-weight:400;
}

.fw-medium-bold {
    font-weight:600;
}

.fw-bold {
    font-weight: 700;
}

.ff-normal {
    
}

.plain-link {
    text-decoration: none;
}

/* --------- iphone portrait -----------  */
/*@media screen and (max-width: 320px) {*/
@media screen and (max-width: 540px) {
    body {
        font-size:1.25em;        
    }
		
}

/* --------- ipad portrait -------------  */

/*
    I think covering both portrait and landscape at once will be fine.  
    -- This also covers 1366 x 768 on computer browsers (15% as of 1/30/2020)  
*/
@media screen and (min-width: 481px) and (max-width: 1366px) {
    
}