iframe.hymn {
  width:220px;
  height:130px;
}
a {text-decoration:none;}
a.pagename {
  font-weight:bold;
  font-family:serif;
  font-size:27px;
  color:black;
}
a.pagename:hover {
  color:#4CAF50;
}
a.pagelink {
  color:blue;
}
a.pagelink:hover {
  color:#4CAF50;
}
input[type=text], input[type=password] {
  display:inline-block;
  width:100%;
  padding:8px 0;/*very important keep input field center*/
  border:1px solid #aaa;
  border-radius:3px;
  box-sizing:border-box;
}
input[type=submit], button{
  display:inline-block;
  padding:5px;
  border:none;
  border-radius:5px;
  background-color:#4CAF50;
  color:white;
  cursor:pointer;
}
input[type=submit]:hover,button:hover {
  background-color:#45A049;
}

table {
  margin:auto;
  border-collapse:collapse;
  max-width:100%;
  font-size:12px;

}
th {
  text-align:left;
}
table#history tr:nth-child(even){
  background-color:#f2f2f2;
}
table#history tr:nth-child(even):hover{
  background-color:#ddd;
}
table#history tr:hover {
  background-color:#ddd;
}
table#coming tr:hover {
  background-color:#ddd;
}
table#history tr.head:hover {
  background-color:white;
}
table#coming tr {
  background-color:#f2f2f2;
}
table#coming tr.head {
  background-color:white;;
}
table#coming tr.head:hover {
  background-color:white;
}
/*
tr.head:hover {
  background-color:white;
}*/

td,th {
padding-left:5px;
padding-top:5px;
padding-bottom:5px;
}
ul#navigate {
    list-style-type: none;
    margin: 0;
    padding: 10px 0;
    width: 150px;
    background-color: #f1f1f1;
    position: fixed;
    height: 100%;
    overflow: auto;
    font-size:13px;
}
ul#navigate > li a {
    display: block;
    color: #000;
    padding: 10px 10px;
    text-decoration: none;
}
ul#navigate > li a.active {
    background-color: #4CAF50;
    color: white;
}
ul#navigate > li a:hover:not(.active) {
    background-color: #777;
    color: white;
}
/*div#sharescr:hover {
 //width:100%;
 //height:100%;
}*/
div.dropdown{
  display:none;
  position:fixed;
 /* //top:50px;*/
  width:200px;
  right:91px;
  background-color:#f1f1f1;
}
ul#topbar, ul#topbarphone {
    list-style-type: none;
   /*// position:fixed;*/
    width:100%;
    margin-left:0;
    margin-right:0;
    height:40px;
    margin: 0;
    padding: 0;
    overflow:;
    background-color: #444;
    font-size:12px;
}

ul#topbar > li, ul#topbarphone > li{ 
    float: left;
    background-color: #444;
    height:40px
}
#login{
    display:block;
}
@media screen and (max-width: 480px) {
         #topbar li a{
           font-weight:bold;
       }
    ul#topbar >li {
      width:100%;
      border-bottom:1px solid black;
       
    }

    /*
    #login{
      display:none;
    }
    */
    #shareandhymn{
      display:none;
    }
    iframe.hymn {
  width:70px;
  height:50px;
  }
  iframe.hymn:hover {
    width:360px;
    height:240px;
  }
}

ul#topbar > li a {
    display: block;
    margin:0px;
    color: white;
    height:40px;
    line-height:20px;
    text-align: center;
    padding-right:16px;
    padding-left:16px;
    /*padding:10px 16px;*/
    text-decoration: none;
}
ul#topbarphone > li a {
    display: block;
    margin:0px;
    color: white;
    height:40px;
    line-height:20px;
    text-align: center;
    padding-right:25px;
    padding-left:25px;
    /*padding:10px 16px;*/
    text-decoration: none;
}

ul#topbar > li a:hover {
    background-color: #111;
}
div#scriptures {
  max-height:90px;
  overflow:auto;
}