@media only screen and (max-width: 480px) {
  body {
    background-color: lightblue;
  }
  h1 {
    font-size: 18pt;
  }
}
@media screen {
body {
  background: #CCC; /* url("http://wings.buffalo.edu/images/backgrounds/sky.jpg;"); */ /* repeat-x; */
  font-family: 'Ubuntu', sans-serif; /* Verdana, Arial, sans-serif; */
  line-height: 24pt;
/*  text-align: center; */
}
a {
  color: #005BBB; /* #00F; */
  font-style: italic;
  font-weight: bold;
  text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
  /* text-align: center; */
  color: #005BBB; /* #00F; */
}
#main {
  background: #FFF;
  background-size: 100%;
  border-radius: 11px;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  /* text-align: center; */
  margin: 0 10% auto;
  padding: 2% 2% 2% 2%;
  width: 80%;
}
header, footer, aside, section, article, aside, #about, #ub, #bsc, #nccc, #trocaire, #contract, #freelance, #resume, #footer  {
  background-color: #ADD8E6;
  background: #DDD; 
  border-radius: 11px;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  clear: both;
  display: block;
  color: #000;
  margin: 2% 2% 1% 2%;
  padding: 1% 5% 1% 5%; /* top right bottom left */ 
  text-align: left;
} 
#content {
  padding: 1% 5% 1% 5%; /* top right bottom left */ 
}
/* #applications, #consulting, #database, #teaching, #training, #webdesign, #contact, #note,
#ub, #bsc, #nccc, #trocaire, #contract, #freelance, #resume {
  display: none;
} */
#about {
  display: block;
  margin: 0 0 0 0;
  padding: 0 0 0 10%;
}
header, section, section > p, footer, footer > p {
  background: #CCC;
  border-radius: 11px;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
}
header {
  background-color: #ADD8E6;
}
form {
  font-size: smaller;
}
.fieldContainer {
  margin: 0 0 1% 0;
}
#info, #info p {
  font-size: large;
  padding: 0 1% 0 0;
}
label {
  color: #005BBB;
  float: left;
  font-family: 'Ubuntu', sans-serif; /* Verdana, Arial, sans-serif; */
  font-weight: bold;
  text-align: right;
  width: 15%;
}
logo {
 position: absolute; 
 z-index: 1;
}
.required {
  color: red;
  font-weight: bold;
}
nav {  
  clear: both;
  color: #000;
  display: block;
  margin: 0 0 0 15%;  
  padding: 0 10%; 
  text-align: center;
} 
nav, #nav {
  background: none !important;
  height: auto;
}
nav ul { 
  list-style: none; 
} 
nav ul li {
  background-color: #005BBB;
  border-right: 1px solid #CCC;
  color: #000;
  float: left;
  font-size: smaller;
  padding: 1%;
}
#nav ul li a {
  color: #FFF;
  display: block;
  font-size: smaller;
  font-style: normal;
  text-align: center;
  text-decoration: none;
  width: 100%;
}
#nav ul li a:active, nav ul li a:active {
  color: #005BBB !important;
}
nav ul li a:hover {
  color: #ccc;
}
#nav , nav {
  clear: both;
  display: block;
  margin: 0 0 0 15%;
  padding: 0px;
  text-align: center;
} 
#note {
  background-color: red;
  border-radius: 11px;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  color: white;
  display: block;
  font-weight: bold;
  margin: 0 0 0 20%;
  padding: 1% 2% 1% 2% !important;
  width: 50%;
}
#schedule {
  text-align: center;
}
#schedule th {
  background-color: #CCC;
  border: ridge 1px;
}
#schedule tr td {
  border: ridge 1px;
  padding: 0 1em 0 1em;
}
.note {
  background-color: red;
  font-weight: bold;
  color: white;
}
.schedule strong { 
  color: red; 
  text-align: center;
}
.tab-selected {
  background: #CCC;
  border-top: solid 1px #005BBB;
  border-right: solid 1px #005BBB !important;
  border-bottom: solid 1px #CCC;
  border-left: solid 1px #005BBB;
  color: #005BBB !important;
}
.tab-selected a {
  color: #FFF !important;
}
.tab-not-selected {
  background-color: #005BBB;
  color: #FFF;
}
table {
  margin: 2px;
  padding: 2px;
}
td, tr {
  vertical-align: top;
}
.imgRounded {
  border-radius: 11px;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  height: 130px; 
  float: left;
  margin: 0 10% 0 0;
  width: 160px;
}
.evenRow tr td {
  background-color: #DDF;
  border: ridge 1px;
}
.evenRow {
  background-color: #ddF;
}
.oddRow {
  background-color: #CCF;
}
.oddRow  tr td{
  background-color: #CCF;
  border: ridge 1px;
  text-align: center;
}
.ulNone li {
  list-style-type: none;
}
}

@media print {
  h1, title, img, nav, #intro {
    display: none;
  }
  #info, #info p {
    padding: 0 1% 0 0;
  }
  img {
    display: none;
  }
  label {
    width: 20%;
  }
  #main {
    margin: 0 0 0 0;
  }
  nav ul { 
    list-style: square; 
  } 
  #recipe {
    border: 1px solid #000;
  }
}
#avatar, #changeFont, #changeColors {
  background-color: #005BBB;
  color: #fff;
  border-radius: 40%;
  display: block;
  /* font-size: 1em; */
  width: 2.5em;
  height: 2.5em;
  line-height: 2.5em;
  text-align: center;
  vertical-align: middle;
  margin-right: 1em;
}
#changeFont, #changeColors { 
   margin: .5vw 0 auto;
}
#widgets { 
   margin: 0 0 1% 0;
   position: fixed;
}
#cgText, #bgText {
    display: none;
}
/*
@media handheld {
  #info, #info p {
    padding: 0 1% 0 0;
  }
  img {
    display: none;
  }
  label {
    width: 20%;
  }
  #main {
    margin: 0 0 0 0;
  }
  nav ul { 
    list-style: square; 
  }
  #main {
    width: 100%;
  }
}
*/