html {
    font-family: 'Lucida Sans', sans-serif;
}

.vwhitespace{
    height:1.5em;
}

.hwhitespace{
    float:left;
}

.clock{
    font-size:3.5em;
    background-color:#e6e600;
    text-align:center;
    border-radius:1em;
}

.apptDisplay{
    
    font-size:3.5em;
    background-color:#e6e699;
    text-align:center;
    border-radius:1em;
    
}

.eventTable{
    display: inline-table;
    width:80%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0px solid;
    text-align:center;
}

.eventDisplay{
    color:#5600c4;
    font-size:3.5em;
    
}

.verseDisplay{
    color:#5600c4;
    font-size:2.5em;
    text-align:center;
    border:1px solid;
    border-radius:1em;
    
}


.message{
    font-size:2em;
    background-color:white;
    text-align:center;
    border-radius:15px;
}
* {
    /*sizing based on the outer most dimensions of border (regardless of thickness)*/
    box-sizing: border-box;
}




/*select any element contains at least one occurrence of col- as its class value.*/
/*https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors*/
[class*='col-'] {
    float: left;
    padding: 5px;
}

.myDivider {
    background-color: #1d1052;
    color:white;
    width:100%;
}


/* For desktop: */
.col-1{width:4.17%;}
.col-2{width:8.33%;}
.col-3{width:12.5%;}
.col-4{width:16.67%;}
.col-5{width:20.83%;}
.col-6{width:25%;}
.col-7{width:29.17%;}
.col-8{width:33.33%;}
.col-9{width:37.5%;}
.col-10{width:41.67%;}
.col-11{width:45.83%;}
.col-12{width:50%;}
.col-13{width:54.17%;}
.col-14{width:58.33%;}
.col-15{width:62.5%;}
.col-16{width:66.67%;}
.col-17{width:70.83%;}
.col-18{width:75%;}
.col-19{width:79.17%;}
.col-20{width:83.33%;}
.col-21{width:87.5%;}
.col-22{width:91.67%;}
.col-23{width:95.83%;}
.col-24{width:100%;}


@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*='col-'] {
    width: 100%;
    }
}

.myInput {
    border:1px solid;
    border-radius:9px;
}

div:focus {
    background-color:#fcf9de;
    outline: 0px;
}

.sendButton{
    width:100%;
    font-size:2em;
    margin-left: auto;
    margin-right: auto;
    border-radius:9px;
    background-color:#7fb3e6;
    border:none;
}
