:root
{
    --blue: #4890b6;
}

:focus
{
    border : none;
    outline : none;
    box-shadow: 0 0 6px #72c6ff;
}

body
{
    text-align: center;
    font-size: 19px;
    font-family: sans-serif; 
    margin : 0;
    padding : 0;
    padding-bottom: 2em;
}

p, ul
{
    padding: 1em 0;
    margin: 0 auto;
    text-align: left;
    width: 50%; 
}

h1
{
    width: 80%;
    margin: auto;
}

h2
{
    width: 80%;
    margin: auto;
    padding: 1.5em 0; 
}

h3
{
    width: 60%;
    margin: auto;
    padding: 1em 0; 
}

button
{
    cursor : pointer; 
    border: none;
    padding: 1em 2.5em;
    font-size: 1em;
    font-weight: bold;
    color: white;
    background-color: var(--blue);
    transition-duration: 0.2s;
    border-radius: 3px;
}

button:hover
{
    box-shadow: 0 0 6px #00000057; 
}

button:active
{
    background-color : white; 
    color : var(--blue) ;
}

button:disabled
{
       background-color: #adadad;
    color: #7c7c7c;
    cursor: not-allowed; 
}

button:disabled:hover
{
       box-shadow : none; 
}
ul li
{
    padding: 1em 0; 
    list-style : none;
}

ul li.ok, ul.valid-icon li
{
    list-style: outside url(https://teach.motion-live.com/images/valid-24.png); 
}

or 
{
    color: #ff8700;       
}

ver
{
    color: #02991f;   
}

input
{
    padding: 0.7em 1.3em;
    font-size: 1em;
    border: none;
    border-bottom: solid 2px; 
    margin-left: 2em;
    min-width: 300px;
    transition-duration: 0.2s;
}

label
{
    display: block;
    text-align: left; 
}

label span
{
       display: inline-block;
    width: 20%; 
}

button.close
{
       background-color: inherit;
    color: #9b9b9b;
    padding: 0;
    font-size: 0.8em;
    font-style: italic; 
}

button.close:hover
{
       box-shadow : none; 
       text-decoration : underline;
}

img.icon
{
    width : 32px;
}

@media (max-width:840px)
{
    p, ul
    {
        width : 95%; 
    }
    h2, h3, h4
    {
        width : 98%; 
    }
    ul.valid-icon
    {
           width: 80%; 
    }
}

@media (max-width:450px)
{
    body
    {
          font-size : 16px;  
    }    
}
