* {
      box-sizing: border-box;
     -moz-box-sizing:border-box;
    }

    body 
    {
      min-width: 1600px;
      background-color: #00FFFF;
      color: #0000FF;
      color: black;
      font-size: 16px;
      
/*     
      border-color: green;
      border-style: solid;
      border-width: 5px;
*/
      
   }

.masthead
   {
      display: inline-block;
      width: 1100px;
      text-align: center;
      background: brown;
      color: white;
/*      
      border-color: orange;
      border-style: solid;
      border-width: 5px;
*/
  }
  
.masthead-left
   {
      display: inline-block;
      float: left;
      width: 275px;
/*   
      border-color: blue;
      border-style: solid;
      border-width: 5px;
*/
  }
.masthead-center
   {
      display: inline-block;
      float: left;
      width: 550px;
   
/*   
      border-color: red;
      border-style: solid;
      border-width: 5px;
*/
  }
.masthead-right
   {
      display: inline-block;
      float: left;
      width: 275px;
   
/*   
      border-color: yellow;
      border-style: solid;
      border-width: 5px;
*/
  }

.content
    {
    position: relative;
    margin: -5px auto;
    width: 1200px;
/*
    border-color: green;
    border-style: solid;
    border-width: 5px;
*/
  }

.content:before, .content:after 
  {
   content: " ";
   display: table;
 }

.content:after 
 {
  clear: both;
 }

.content-navbar::before 
 {
    content: '';
    position: absolute;
    width: inherit;
    top: 0;
    bottom: 0;
    z-index: -1;
    left: 0%;
    background-color: brown;
 }
.content-navbar 
    {
      float: left;
      width:210px;
      margin: 0px;      
/*
      border-color: blue;
      border-style: solid;
      border-width: 5px;
*/
   }
.content-data::before {
    content: '';
    position: absolute;
    width: inherit; /* width is inherited from .content-data */
    top: 0;
    bottom: 0;
    z-index: -1;
    background: #00FFFF; /* canards west background color (note, using "background" (rather than "background-color") 
                            resets all other "background" parameters, except the one specified */
}
.content {
    float:left;
}
.content-data
    {
      display: inline-block;
      float: left;
      width:880px;
      margin-left: 10px;
      text-align: justify;
/*     
      border-color: orange;
      border-style: solid;
      border-width: 5px;
*/
    }


div.picture-container
    {
    display:table;
    margin: 1em auto;
     margin-bottom: 20px;
     width: 660px;
     text-align: justify;
/*
     border-color: green;
     border-style: solid;
     border-width: 2px;
*/
    }

.picture-panorama
    {
    margin: 10px;
    margin-left: auto;
     margin-right: auto;
     width: 660px;
/*
     border-color: blue;
     border-style: solid;
     border-width: 2px;
*/
    }

.picture-center
    {
    margin: 10px;
    margin-left: auto;
     margin-right: auto;
     width: 304px;
/*
     border-color: blue;
     border-style: solid;
     border-width: 2px;
*/
    }

.picture-center-map
    {
     margin-left: auto;
     margin-right: auto;
     width: 700px;
/*     
      border-color: red;
      border-style: solid;
      border-width: 5px;
*/
    }

.picture
    {
     float: left;
     width: 325x;
     padding: 10px;

/*
     background-color: lightgrey;
     border-color: blue;
     border-style: solid;
     border-width: 2px;
*/
    }

.footer
   {
      clear: both;
      display: inline-block;
      width: 1100px;
      height: 30px;
      margin-top: 0px;
      padding-top: 5px;
      background-color: brown;
      color: white;

/*
     border-color: blue;
     border-style: solid;
     border-width: 5px;
*/
  }
/*Creating buttons*/

  .clear /* generic container (i.e. div) for floating buttons */
    {
      overflow: hidden;
      width: 100%;
    }

a.button 
    {
      background: transparent url('/common/bg_button_a-transparent.gif') no-repeat scroll top right;
      color: #444;
      display: block;
/*    float: left;
*/    font: normal 16px arial, sans-serif;
      height: 24px;
      width: 200px;
      text-align: center;
      margin-right: 0px;
      padding-right: 11px; /* sliding doors padding */
      text-decoration: none;
    }

a.button span
    {
      background: transparent url('/common/bg_button_span-transparent.gif') no-repeat;
      display: block;
      line-height: 14px;
      padding: 5px 0 5px 18px;
    }

a.button:active 
    {
      background-position: bottom right;
      color: #000;
      outline: none; /* hide dotted outline in Firefox */
    }

a.button:active span 
    {
      background-position: bottom left;
      padding: 6px 0 4px 18px; /* push text down 1px */
    } 

    
    
/*CSS for the event schedule */
.clearboth {clear:both;}
h1 {
     font-weight: bolder; 
     font-size: 150%; 
     text-align: center;
     }
h3 {
     font-weight: bold; 
     font-size: 110%; 
     text-align: left;
     padding: 0;
     margin: 0;
     margin-top: 40px;
     color: purple;
     }
h4 {
     font-weight: bold; 
     font-size: 100%; 
     text-align: left;
     }
h5 {
     font-weight: bold;
     font-size: 100%;
     text-align: center;
     margin: 10px;
     padding: 10px;
     }
h6 {
    font-weight: normal;
    font-size: 100%;
    padding: 0;
    Margin: 0;
    text-align: right;
   }

  .wrap {
    background:#00FFFF;
    margin: auto;
    width:1024px;
    text-align: center;
  }
  .header {
    background: #00FFFF;
    padding:10px;
  }

.picture
    {
     margin: auto;
     margin-bottom: 20px;
     text-align: justify;
    }

.movie_picture
    {
     float: left;
     margin left: auto;
     padding-top: 0px;
     padding-right: 8px;
    }

IMG.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto }


  .event-schedule-left{
    margin-top: 0px;
    margin-bottom: 30px;
    margin-left: 5px;
    padding: 5px;
    background: yellow;
    float:left;
    text-align: left;
    width:425px;
    height:600px;
  }
  .event-schedule-left p {padding:0 10px;}
  
  .event-schedule-right {
    margin-top: 0px;
    margin-bottom: 30px;
    margin-right: 5px;
    padding: 5px;
    background: yellow;
    float:right;
    text-align: justify;
    width: 425px;
    height:600px;
  }
  
  .event-schedule-right p {padding:0px 10px 0px 0px;}



  .program-description-left{
    margin-top: 10px;
    margin-bottom: 30px;
    margin-left: 5px;
    background: orange;
    padding: 5px;
    float:left;
    text-align: justify;
    width:425px;
    height:550px;
  }
  .program-description-left p {
    padding-left: 0px; 
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 0px;
    }
  
  .program-description-left li {text-align: left;}

  .program-description-right {
    margin-top: 10px;
    margin-bottom: 30px;
    margin-right: 5px;
    background: orange;
    padding: 5px;
    float:right;
    text-align: justify;
    width: 425px;
    height: 550px;
  }
    .program-description-right p {
      padding-left: 10px; 
      padding-right: 0px;
      padding-top: 5px;
      padding-bottom: 5px;
      margin: 0px;
     }

  .bio-left{
    margin-top: 10px;
    margin-bottom: 30px;
    margin-left: 5px;
    background: red;
    padding: 5px;
    float:left;
    text-align: justify;
    width:425px;
    height:400px;
  }
  .bio-left p {padding:0 10px;}

  .bio-right {
    margin-top: 10px;
    margin-bottom: 30px;
    margin-right: 5px;
    background: red;
    padding: 5px;
    float:right;
    text-align: justify;
    width: 425px;
    height:400px;
  }
  .bio-right p {padding:0px 10px 0px 0px;}