/* ------------------------------------
 * Program Name:    styles.css               
 * Written By:      Michele Dijkstra 
 * Last Modified:   03-26-2020
 * ------------------------------------ */

/*  Tag Modifiers  */

html { font-size:	     100%; }
body {
    margin:                  1rem;
    font:                    .9em sans-serif;
    background-color:        #252525;  }

p { margin:                  .1rem; }

a { text-decoration:         none; }

a.dark { 
    text-decoration:         none;  
    color:                   blue; }

a.notPosted { 
    text-decoration:         none;  
    color:                   AAAAAA; }

a.light { 
    text-decoration:         none;  
    color:                   #FFFFFF; }

a:hover { font-weight:       bold; }

ul { margin-above:          0rem;  
     padding-above:         0rem;   }  


/*  Class Modifiers  */

.avatar {
     float:                  left;
     height:                 65px;
     width:                  65px;
     margin:                 0rem;
     padding-top:            0rem;
     padding-left:           5px;
     padding-right:          10px;
}

.title {
     font-family:             Papyrus;
     font-size:               1.6rem;
     font-weight:             bold;
     color:                   #663333;
}

.subtitle-dark {
     font-family:             Arial;
     font-size:               1rem;
     font-weight:             bold;
     color:                   #663333;
     padding:                 0px;
}

.main-dark {
     font-family:             Arial;
     font-size:               .9rem;
     font-weight:             normal;
     color:                   #663333;
}

.intro {
      font-family:	      Arial;
      font-size:	      .9rem;
      font-weight:	      normal;
      color:		      #663333;
}

.subtitle-light {
     font-family:             Arial;
     font-size:               1rem;
     font-weight:             bold;
     color:                   #FFFFFF;
}

.main-light {
     font-family:             Arial;
     font-size:               .9rem;
     font-weight:             normal;
     color:                   #FFFFFF;
}

.quote {
     font-size:               .8rem;
     font-style:              italic;
     color:                   #FFFFFF;
}

.quote-dark {
     font-size:               .8rem;
     font-style:              italic;
     color:                   #663333;
}

.nobullet {
     list-style-type:         none;
}


ul.dashbullet {
  list-style-type:            none;
  padding-left:               18px;
}

ul.dashbullet > li:before {
    content:       "–"; /* en dash */
    margin-left:  -0.9rem; 
}

img.mypic {
    -moz-border-radius,
    -webkit-border-radius:    8px;
    border-radius:            8px;
    box-shadow:		      4px 4px 4px #CCCCCC;
    padding:		      1px;
    color:                    #000000;
    background-color:         #999999;
    height:		      20.3rem; 
    width:		      18.75rem;	
}

/*  Class Modifiers - Schedule  */

.holiday {
     font-weight:             bold;
     color:                   #994444;
}

.rsrc {
     color:                   #6600CC;
     text-align:              center;
}

.hw {
     color:                   #FF9900;
     text-align:              center;
}


.exam {
     color:                   red;
     text-align:              center;
}


.hour {
      color:                  #000000;
      font-weight:            bold;
      background-color:       #e5dccc;
      text-align:             left;
}

.class1 {
     color:                   #FFFFFF;
     background-color:        #333390;
     font-style:              italic;
}

.class2 {
     color:		      #FFFFFF;
     background-color:        #9090DC;
     font-style:              italic;
}

.class3 {
     color:                   #FFFFFF;
     background-color:        #888855;
     font-style:              italic;
}

.officehrs {
     color:		      #333370;
     background-color:        #FFD390;
     font-style:              italic;
}

.mtg {
     color:                   #FFFFFF;
     background-color:        #885555;
     font-style:              italic;
}

.telecommute {
      color:                  #000000;
      background-color:       #ddd1bb;
      font-style:              italic;
}


/*  Class Modifiers - Spacing */

.one-above     { padding-top:    12px;    }
.oneplus-above { padding-top:    18px;    }
.multi-above   { padding-top:    48px;    }
.one-below     { padding-bottom: 12px;    }
.half-above    { padding-top:    4px;     }
.half-margin   { margin-top:     4px;     }
.indent-left   { padding-left:   20px;    }
.color-emph    { color:          #AA00AA; }
.incr-line-spc { line-height:    1.5rem;   }


/*  Table formats          */

.ntable     {  
     display:                 inline-table;
     border-spacing:          1.5px 12px;         
}

.ntable-narrow {  
     display:                 inline-table;
     border-spacing:          1.5px 6px;         
}

.ntable-nospace {  
     display:                 inline-table;
     border-spacing:          1.5px;         
}

.ntable-schedule {
     display:                 table;
     table-layout:            fixed;
     border-spacing:          2px;
}

.trow       {  display:       table-row;    }
.tcell      {  display:       table-cell;   }

.spacer     {  width:         20px;         }
.rspacer    {  height:        24px;         } 
.col-narrow {  width:         5%;           }
.col-medium {  width:         20%;          }
.col-xmed   {  width:         25%;          }
.col-wide   {  width:         30%;          }
.col-xwide  {  width:         40%;          }
.col-xxwide {  width:         60%;          }

.chdr { 
      vertical-align:         middle;    
      padding:                4px;      
      text-align:             center;
}

.cmain {
      vertical-align:         middle;
      padding:                4px;
}

.cmain-ctr {
      vertical-align:         middle;
      padding:                4px;
      text-align:             center;
}

.cmain-top {
      vertical-align:         top;
      padding:                4px;
      padding-top:            6px;
}

.cmain-topctr {
      vertical-align:         top;
      padding:                4px;
      padding-top:            6px;
      text-align:             center;
}

.cmain-left {
      vertical-align:         top;
      padding:                4px;
      padding-top:            6px;
      text-align:             left;
}

.cmain-leftctr {
      vertical-align:         middle;
      padding:                4px;
      text-align:             left;
}

.cmain-right {
      vertical-align:         top;
      padding:                4px;
      text-align:	      right;
}

.header-row {  
      font-weight:            bold;
      background-color:       #FFEEC0;
      height:                 2rem;
}

.odd-row {
      background-color:       #FAF7E6; 
}

.even-row {
      background-color:       #DEDEB8; 
}

.holiday-row {
      background-color:       #B1B1E7;
      height:                 2rem;
      color:                  #FFFFFF;
}


/*  Common box formatting  */

.box {
    box-sizing:               content-box;
    display:                  block;

    -moz-border-radius,
    -webkit-border-radius:    5px;
    border-radius:            5px;
    border:                   1px solid #000000;
}


.box-invisible {
    box-sizing:               border-box;
    display:                  inline;

    -moz-border-radius,
    -webkit-border-radius:    5px;
    border-radius:            5px;
    height:                   100%;
    float:                    right;
}


.box-drawer {
    box-sizing:               content-box;
    display:                  block;
    -moz-border-radius,
    -webkit-border-radius:    5px;
    border-radius:            5px;
    padding:                  10px;
}

.box-cell {
    box-sizing:               content-box;
    display:                  inline-block;
    -moz-border-radius,
    -webkit-border-radius:    4px;
    border-radius:            4px;
    box-shadow:		      3px 3px 3px #CCCCCC;
    padding:                  3px 10px;
    color:                    #000000;
    background-color:         #fbdf93;
}

.box-cell a:hover {
    color:                    #999999;
    font-weight:              normal;
    }