/*
***********************************
****
**** PAGE BG                = #E1E1E1 (white)
**** P:COLOR & B:BG        = Black (#333333)
**** U:BG + A:COLOR        = Lime   (Lime)
**** I:BG                = Cyan (silver)
**** A/VISITED:COLOR        = Lime  (cyan)
**** B:TEXT             = Black ... contrast to Black (can be #E1E1E1)
****
***********************************
*/

/*///////////////////////////////////////////////
///
//
//
// TEXT BLOCKS
//
*/

body {
        font: normal 12pt/14pt 'Ubuntu Mono', serif;
        #font-family: 'Ubuntu Mono';

        background: #E1E1E1;
        /*color: #333333;*/
        color: Black;
        background: white;
}


/*
RATIO = 8 : 25 8 25

...how do you calcualte this?
...i guess it needs to RELATE TO FONT SIZE?

em's ? pixels?

*/
h1 {
        padding: 8px 25 8 25;
        display: inline;


        background: seagreen;
        background: red;

        text-shadow: 2px 2px 1px Black;
        text-shadow: none;

        background: white;
        color: MediumSlateBlue;

        color: white;
        background: MediumSlateBlue;
        background: MediumSpringGreen;


}

/*
Sync padding ratio with h1 !!!
RATIO = 1:3:1:3
MARGIN = 3:1:3:1
*/
h4 {
        display: inline;
        padding: 3px 9 3 9;
        margin: 30px 10 30 10;

        color: #E1E1E1;
        background: Black;

        border: 1px solid #E1E1E1;
        text-shadow: none;
}


/*
****************************************************
* ETHERPAD STUFF
*
*/

.main_container {
        margin: 50px 10 50 10;
        text-align: center;   
}


.etherpad_container {
        display: inline-block;  

        font-size: 120%;
        word-wrap: break-word;
        line-height: 140%;
        text-align: left !important; 

        margin: 80px 30 30 30;
        padding: 10px;

        max-width: 70%;

        background: none;
}


u {
        font-size: 140%;
        color: #E1E1E1 !important;
        /*color: Black !important; /* changed Nov 9 */
        background: MediumSpringGreen ;
        background: black;

        color: white !important;

        color: MediumSpringGreen  !important;
        text-shadow: 2px 1px 0px MediumSpringGreen !important;
        text-shadow: 2px 1px 0px White !important;

        color: white !important;
        text-shadow: 2px 1px 0px White !important;
        text-shadow: 2px 1px 0px MediumSpringGreen !important;
}


strong {
        color: Black; /* changed Nov 9 - no contrast here ...*/

        background: Black;
        background: none;

        display: inline;
        font-style: normal;
        font-weight: bold;

        padding: 3px;
        margin: 3px;

        color: black !important;
}


em {
        color: #E1E1E1;
        color: Black; /* changed Nov 9 */

        display: inline;
        font-style: italic;
        font-weight: bold;
        text-decoration: underline;
        text-decoration: none;
}

a:link {
        color: navy  ;

        color: MediumSpringGreen;
        color: SpringGreen;
        color: MediumSeaGreen;

        color: MediumSlateBlue;
}

a:visited {
        color: navy ;

        color: MediumSpringGreen;
        color: SpringGreen;
        color: MediumSeaGreen;
        
        color: MediumSlateBlue;
        color: MediumSeaGreen;
}

a:hover {
        font-weight: bold;
        color: MediumSlateBlue;
}

.btn {
        background: seagreen  ;
        color: #E1E1E1;
        text-shadow: none;
}


/***********************************************/


strong em {
    background: MediumSpringGreen ;
    background: PaleGreen ;
}

/* THIS ONE DOES NOT SEEM TO HAPPEN */
em strong {
    background: cyan;
}

strong em s {
    text-decoration: none;
    background: LightSalmon ;
    background: Salmon ;
    background: MediumSlateBlue;
    
    color: white;

}