/*
Design by html.it
*/


html,body{
    margin:0; 
    padding: 0
}
body{
    font-family: arial,sans-serif; 
    font-size: 76%;    
    background-image: url(img/backg_2.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    background-color: #d5d5d5;
/* Gray case
    background-color: #555; */
}

/********************* The container *********************/
div#container{ 
    width: 760px;
    margin: 0px auto;   /*centra negli altri browsers*/
    text-align: left;   /*ripristina l' allineamento*/
/*    border-left: 2px solid #000;
    border-right: 2px solid #000;*/
/* Gray case
    background-color: #555; */

}

/********************* The header *********************/
div#header{
    position: relative;
    top: 0px;
    width: 233px;
    height: 263px;
    padding: 10px; 
    margin-left: 20px;
    margin-bottom: 20px;
    border-left: 6px double #000;
    border-right: 6px double #000;
    border-bottom: 6px double #000;
    background-color: #fff;
    z-index: 50;
/* Gray case
    background-color: #5f5e5c; */
/*background: url(img/aop_logo.png)*/
}
h1{
    margin: 0;
    padding:0
}
h2{
    font-size:1.5em; 
}


a{
    text-decoration: none;
    color: #f9a910;
}
a:hover{
    font-weight: bold;
}
a:visited{
    text-decoration: none;
    color: #c58304; 
}
.sub{
    vertical-align: sub;
    font-size: 0.6em;
}
.super{
    vertical-align: super;
    font-size: 0.6em;
    padding-right: 0.6em;
}

p.login_p{
    text-align:center; 
   font-size: 0.8em;
   margin-top: 15px;
   padding: 0;
}

p.centered_title_h1{
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 1em;
    padding: 0;
}
p.centered_title_h2{
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    margin: 1em;
    padding: 0;
}
p.centered_title_h3{
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin: 1em;
    padding: 0;
}
img.hidden{
    border: 0;
}

a.hidden:hover{
    border: 0;
}
/********************* The navigation menu *********************/
div#navigation{
    float: right;
    position: absolute;
    top: 0px;
    left: 280px;
    width: 460px;
    margin: 7px;    
    padding-top: 8px;
    padding-bottom: 8px;
    color: #000;    
    background-color:#fff;
    z-index: 50;
/* Gray case
    color: #eee;    
    background-color:#5f5e5c; */
}
div#navigation ul.menu{
    list-style-type: none; /* disc, square, circle */
    margin: 0;
    padding: 0;
}
div#navigation ul.menu li{
    margin:0 0.15em;  /* these instructions are needed */
    padding:0;        /* to display a vertical list    */
    float:left;       /* in an horizontal line.        */
    display:block;
    position:relative;   
    color: #000;
    background-color: #fff;
    font-size: 120%;
    font-style: italic;
/* Gray case
    color: #eee; 
    background-color:#5f5e5c; */
}
div#navigation ul.menu li a{
    text-decoration: none;
    color: #000;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 4px;
    padding-right: 4px;
/* Gray case
    color: #eee; */
}
div#navigation ul.menu li a:hover{
    color: #222;
    background-color: #ddd;
}
div#navigation ul.submenu{
    position: absolute;
    top: 30px;
    left: 200px;
    margin: 0;
    padding-left: 1px;
    list-style: none;
    text-align: left;
    z-index: 60;
    display: none;

}
div#navigation ul.submenu li{
    float: none;
    width: 100px;
}
div#navigation ul.submenu li a{
    display: block;
}
div#navigation ul.menu li:hover ul.submenu{
    display: block;
}

/********************* The contents *********************/
div#content{
    position: relative;
    top: 0px;
    margin-top: -80px;
    padding: 80px;
    border: 2px solid #000;
    background-color: #fff;
    text-align: justify;
    z-index: 10;
/* Gray case
    color: #eee;
    border: 2px solid #eee;
    background-color: #5f5e5d; */
}

div#content p{
    line-height:1.3em;
}
img.home_image_h{
    width: 550px;
    height: 412px;
    display: block;
    margin-top: 45px;
    margin-left: 28px; /* There is a 77px offset! */
}

img.home_image_v{
    width: 412px;
    height: 550px;
    display: block;
    margin-top: 45px;
    margin-left: 96px; /* There is a 77px offset! */
}

div#caption{
    text-align: center;
}
p.about{
   text-align: center;
   font-size: 0.8em;
}

img.left_image{
    width: 200px;
    float: left;
    margin: 10px;
}

img.right_image{
    width: 200px;
    float: right;
    margin: 10px;
}

p.centered_par{
    text-align: center;
    margin: 4em;
}

p.centered_img{
    text-align: center;
}
p.nav_items{
    text-align: center;
    font-size: 1.2em;
    margin: 0;
    padding: 0;
}
div.clearer_left{
    clear: left;  /* Needed if the text is too short (thanx html.it) */
}

div#footnotes{
    margin-top: 30px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    border-top: 1px solid black;
/* Gray case
    border-top: 1px solid #eee; */
}
div#footnotes p{
    font-size: 90%;
}

/********************* Flowers page *********************/
img.flyer{
    margin-top: 30px;
    margin-left: 200px;
/*    margin-right: auto;*/
}
table.flowers_table{
    table-layout: fixed;
    width: 500px;
    margin-left: auto;
    margin-right: auto;
}
tr.flyer_row{
    vertical-align: bottom;
    text-align: center;
    height: 160px;
}
table.flowers_table a{
    text-decoration: none;
    font-size: 120%;
    font-style: italic;
    color: #f9a910;
}
table.flowers_table a:hover{
    font-weight: bold;
}
table.flowers_table a:visited{
    color: #c58304;
}
/********************* Concert schedule *********************/
div.sched_title{
    text-align: center;
    font-size: 2.5em;
    margin-top: 0.25em;
    margin-bottom: 0.5em;
}
div.sched_subtitle{
    text-align: center;
    font-size: 2em;
    margin-top: 0.25em;
    margin-bottom: 0.5em;
}

div.event{
    text-align: center;
    margin-top: 2em;
    margin-bottom: 2em;
    font-size: 120%;
}
div.artist{
    font-size: 1.2em;
    margin-top: 0.25em;
    margin-bottom: 0.25em;
}
ul.components{
    list-style-type: none;
    font-style: italic;
    font-size: 0.9em;
    margin: 0.2em;
    padding: 0;
}
li.instr{
    list-style-type: none;
    font-style: normal;
    font-size: 0.7em;
    margin-bottom: 0.3em;
    padding: 0;
}
div.title{
    font-size: 1.4em;
    margin-top: 0.4em;
    margin-bottom: 0.5em;
}
div.music_by{
    font-size: 0.8em;
    margin-top: 0.5em;
}


div.h_title{
    text-align: center;
    margin-top: 0.5em;
    font-size: 3em;
}
div.h_date{
    text-align: center;
    margin-top: 1.1em;
    font-size: 2em;
}
div.h_time{
    text-align: center;
    margin-top: 0.5em;
    font-size: 1.5em;
}
div.h_location{
    text-align: center;
    margin-top: 0.5em;
    font-size: 2em;
}
div.h_artist{
    text-align: center;
    margin-top: 1.1em;
    font-size: 2.25em;
}
div.h_instr{
    text-align: center;
    font-style: italic;
    margin-top: 0.1em;
    font-size: 1.5em;
}
ul.h_ensemble{
    text-align: center;
    margin: 3em;
    padding: 0;
}
li.h_name{
    list-style-type: none;
    font-size: 1.8em;
    margin-top: 0.3em;
}
li.h_component{
    list-style-type: none;
    font-style: italic;
    font-size: 1.2em;
    margin-top: 0.3em;
}
li.h_comp_instr{
    list-style-type: none;
    font-size: 1em;
/*    margin: 0.2em;*/
}
div.h_concert_title{
    text-align: center;
/*    font-style: italic;*/
    margin-top: 0.5em;
    font-size: 3em;
}
div.h_concert_subtitle{
    text-align: center;
    font-style: italic;
    margin-top: 0.1em;
    font-size: 2em;
}

div.h_event{
    text-align: center;
    margin-top: 1.1em;
    margin-bottom: 1.1em;
}
div.work{
    font-style: italic;
}
div.author{
    font-size: 1em;
    margin-bottom: 0.2em;
}
ul.movements{
    list-style-type: none;
/*    font-style: italic;*/
    font-size: 0.9em;
    margin: 0.2em;
    padding: 0;
}
div.from{
    font-size: 0.9em;
    font-style: normal;
}
div.instrument{
    font-style: italic;
    font-size: 1.1em;
}    
/********************* Church table *********************/
table.church_table{
    table-layout: fixed;
    width: 550px;
    margin-left: auto;
    margin-right: auto;
}

tr.img_row{
    vertical-align: bottom;
    text-align: center;
    height: 120px;
}
tr.text_row{
    text-align: center;
    vertical-align: top;
}
ul.church_list{
    list-style-type: none;
    margin: 0;
    padding: 0;
}
table.church_table a{
    text-decoration: none;
    font-style: italic;
    color: #f9a910;
}
table.church_table a:hover{
    font-weight: bold;
}
table.church_table a:visited{
    color: #c58304;
}
/********************* Stops list *********************/
div.keybd{
    font-size: 120%;
    font-style: italic;
    text-align: center;
}
div.compass{
    text-align: center;
}
div.stops_left_col{
    float: left;
    margin-top: 0.5em;
    margin-left: 50px;
}
div.stops_right_col{
    float: right;
    margin-top: 0.5em;
    margin-right: 50px;
}
ul.stoplist{
    list-style-type: none;
}
div.clearer_both{
    clear: both;
}
/********************* The footer *********************/
div#footer{
    padding:0.5em; 
    color:#eee;  
/*    border: 1px solid black; */
    background-color:#555; 

}
p.foot{
    text-align:center; 
   font-size: 0.8em;
   margin: 0;
   padding: 0;
}
div#login{
   width: 30px;
   float: right;
   font-size: 0.8em;
   margin: 0;
   padding: 0;
}
/********************* Editing pages *********************/
tr.label_row{
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: black;
    font-weight: bold;
}
tr.field_row{
   font-style: italic;
}

table.members_table{
    table-layout: fixed;
    width: 700px;
    margin-left: auto;
    margin-right: auto;
}
tr.members_label{
   font-weight: bold;
}
tr.members_row{
   font-style: italic;
}
div.artists_left_col{
    float: left;
    margin-top: 25px;
    margin-left: 25px;
}
div.artists_right_col{
    float: right;
    margin-top: 25px;
    margin-right: 50px;
}