body { font-family: 'Source Sans Pro', sans-serif; font-size:20px;}
a, a:visited, a:link { text-decoration : none; color: inherit; border-bottom: 2px dotted #ccc;}
a:hover { border-bottom: 2px solid #663399;}
input,textarea { width: 100%; margin-bottom: 20px; border-radius: 5px; border: 1px solid #ccc; padding: 5px 10px;}
input[type="checkbox"] { width: auto; text-align:right; }


textarea { height: 50vh;}
#about h1 { font-size: 100%; margin-left:20px; margin-bottom: 20px;}
#about h2 { font-size: 120%;}
#about h3 { font-size: 110%;}
#about p  { margin-left:20px; margin-right: 20px;}

#settings p  { margin-left:20px; margin-right: 20px; margin-bottom: 5px;}
#settings .top_margin  { margin-top:30px; }
#settings p span { width: 200px; display: inline-block;}

#banner { background-color: #663399; color: white; padding-left: 10px; margin-bottom: 10px; border-radius: 5px; padding-bottom:5px;}
#banner h1 { font-size: 110%;}
#banner .bttn { padding: 0px 15px; margin-top: 5px;float: right; margin-right: 10px; background-color: #663399; color: white; font-size: 80%; border: 1px solid white; border-radius: 5px;}
#banner .bttn a { color: white; text-decoration: none; }
#banner nav { padding-top:2px;}
#filter { margin: 0px 10px; }
#filter select {float: right; font-size: 70%;
margin-top: 2px;}
#srch { margin: 0px 10px 20px 10px; display: none;}
#srch button {margin-right: 20px;}

#container { max-width: 600px; margin: 5px auto;}

form button { margin-right: 30px; background-color: #663399; color: #fff; border: 1px solid; border-radius: 5px;}
form button a  { border-bottom: none !important;}

form,#about { padding: 10px;}
#about p { margin-bottom: 15px;}
#about em { font-size: 90%;}
.event_date { background-color: #eee; }

.event_date p { color: #663399; margin-left: 10px; font-size: 90%;}
.event_item p { margin: 10px 10px; }


.event_container { margin: 30px 0px; border: 1px solid #eee; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 9px 0px; border-radius: 5px;

}

.del_warn { background-color: coral;}

@media screen and (max-width: 600px) {
  #banner { border-radius: 0px;}
}

@media screen and (min-width: 600px) {
 #container { margin-top:10px;  margin-bottom: 20px;}
}
