body { background-color: #FFD; color: black; font-size: 13px;
background-image:url(images/bg.jpg); padding:0px; margin:0px; 
font-family:Arial, sans-serif; }

a          { text-decoration: none; font:arial,helvetica,sans-serif; 
             font-weight: bold; color:#C00; }
a:visited  { color: #700 }
a:active   { background: #4E4 }
a:hover    { color: #000; background: #EE4}

.midtext {font-size: 17px;}
span.red { background: #FFD; color: red }
span.brown { background: #FFD; color: #900 }
span.bigbrown { font-size: 18px;background: #FFD; color: #900 }
span.emph {color: #900; font-weight: bold;}
.indented {padding: 0 0 0 30px;}
/* .pictures-text {padding: 0 -10px 0 -10px; } */

div#top {
     background: #A00;
     color: white;
     min-width:100%;
}

ul.main { padding: 0 0 0 15px; }
ul.main li {margin: 4px 0 0 0px}

table > tr > td {padding: 5px}
table > tr > th {padding: 5px}

 .nav > li > a {
   background-color:   #A00;
   color: white;
   text-decoration: none;
 }
 .nav > li > a:hover, .nav > li > a:focus {
   background-color:   #C00;
   color: black;
 }
 .nav > li.active > a {
   background-color:   #700;
   color: white;
 }
 .nav > li.active > a:hover {
   background-color:   #700;
   color: black;
 }
 .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
   background-color:   #C00;
   border-color:   #700;
 }
 .navbar-header > a { 
   background-color:  #A00; color: white; 
   font-size: 1.5em; line-height: 0.6; text-decoration: none;
 }
 .navbar-header > a:hover, .navbar-header > a:focus {
   background-color:   #A00;
   color: black;
 }
 .dropdown-menu {
   min-width: 100px;
   background-color:  #A00;
 }
 .dropdown-menu > li > a {
   color: white; 
   background-color:  #A00;
   text-decoration: none;
 }
 .dropdown-menu > li.active > a {
   background-color:   #700;
   color: white;
 }
 .dropdown-menu > li.active > a:hover {
   background-color:   #700;
   color: black;
 }
 .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
   background-color:   #C00;
   color: black;
 }

@media screen and (min-width: 600px) {
   img#uclogo { vertical-align: middle }
   div.mainbody { padding: 20px ;}
   div#worship {max-width: 550px; }
   div#worship-back { background:#FFD url('images/window3a.png') no-repeat;
                      background-position: 550px 0px;}
   div#myCarousel {margin:auto; width:600px;}
   div.map { display: table-cell; }
   div.dropdown {display:none;}
   
}
@media screen and (max-width: 599px) {
   img#uclogo { float: left; }
   div.mainbody { padding: 10px ;}
   div#myCarousel {width: 100%;}
   div.map { display: none; }
   div.dropdown {display:inline-block; }
}
@media screen and (min-width: 650px) {
   td#young-table-pictures{ display: table-cell;}
   div#young-end-pictures{ display: none;}
   td#top-text {font-size:30px}
   img#uclogo {width:92px; height:92px;}
   div.map { max-width: 177px; }
}
@media screen and (max-width: 649px) {
   td#young-table-pictures{ display: none;}
   div#young-end-pictures{ display: table;}
   td#top-text {font-size:20px}
   img#uclogo {width:46px; height:46px;}
}
@media screen and (min-width: 750px) {
   td#main-background{ display: table-cell;}
   td#us-table-pictures{ display: table-cell;}
   div#us-end-pictures{ display: none;}
   td#contact-table-picture { display:table-cell;}
   div#contact-end-picture { display:none;}
}
@media screen and (max-width: 749px) {
   td#main-background {display: none;}
   td#us-table-pictures{ display: none;}
   div#us-end-pictures{ display: table;}
   td#contact-table-picture { display:none;}
   div#contact-end-picture { display:table-cell;}
   ul.navbar-nav {max-width: 170px; float: right; }
}
@media screen and (min-width: 800px) {
   td#group-table-pictures{ display: table-cell;}
   div#group-end-pictures{ display: none;}
   div.map {position: relative;}
}
@media screen and (max-width: 800px) {
   td#group-table-pictures{ display: none;}
   div#group-end-pictures{ display: table;}
}