/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

 body
 {
    font-family: Helvetica,Arial,Lucida,sans-serif;
    font-size: large;
    height:100%;
    background-color: whitesmoke;
    overflow:hidden;
 }
 
 .page_contents
 {
    display: inline-block;
    height: 87vh;
    position: absolute;
    width:91.7%;
    overflow-y: scroll;
    scrollbar-gutter: stable;
 }

 form button, button, .style_button input
 {
    background-color: #1DA748;
    color: #fefae0;
    border-radius: 15px;
 }

 .style_button input
 {
    background-color: #1DA748;
    color: #fefae0;
 }

 form input
 {
   padding-inline: .9em;
   border-radius: 1.2em;
   width: 360px;
 }

.invisible_button
{
   background:none;
   padding-block:0;
   font-size: 1em;
   border:none;
   cursor:pointer;
   color: inherit;
}

a
{
   color: #004D9D;
   text-decoration: none;
}

.home
{
   margin-top: 150px;
   text-align: center;
}

.modal-header
{
   background-color: #1DA748;
   color:white;
}

.modal-body
{
   text-align: center;
   font-weight: bold;
}

.modal-header
{
   flex-direction: row;
   justify-content: space-between;
   font-weight: bolder;
}

.modal-header i
{
   font-size: larger;
   opacity: .75;
   color:white
}

.modal-header i:hover
{
   opacity: 1;
}

h1
{
   padding-left: 15px;
   padding-top:10px;
}

.notification
{

}

.flashes
{
   padding-left: 15px;
   padding-block: 10px;
}

.modal-backdrop {
  opacity: .25 !important;
}

.modal-header i
{
   cursor: pointer;
}

.modal-header h1
{
   font-size: x-large;
}

.grid input:checked{
  background: #2196F3;
}