body { 
    margin:40px auto;
    max-width:780px;
    line-height:1.6em;
    font-family: 'Roboto', sans-serif;
    font-size:14pt;
    color: #444;
    padding: 0 10px
}

.flag {
    display:inline-block;
    height:0.8em;
    width:1.3em;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.pride {
    background-image: url("/images/flag-pride.png");
}
.trans {
    background-image: url("/images/flag-trans.png");
}
.progress-pride {
    background-image: url("/images/flag-progress-pride.png");
}

h1,h2,h3 {
    line-height: 0.9;
    /*border-left: 5px solid;
      padding-left: 15px;*/
    margin-top: 40px;
    margin-bottom: 40px;
}
#logo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 40px; 
    width: 40%;
    -webkit-filter: drop-shadow( 5px 5px 5px #555 );
    filter: drop-shadow( 5px 5px 5px #555 );
    transition: opacity 0.7s ease-in-out;
}
.sm-ln {
    float: right;
    font-size: 12pt;
    display: block;
    clear: both;
}
.warning {
  /* taken from bootstrap 4 */
  color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
  padding: 1em;
}
a{
    /*text-decoration: none;*/
}
td {
    padding-right: 20px;
}
abbr {
    border-bottom: 1px black dotted;
/*      text-decoration: underline;
      -webkit-text-decoration-style: dotted;
      text-decoration-style: dotted;*/
}


.notice {
    border: 4px dashed pink;
    padding: 2em;
}


.notice-yellow {
    border: 4px dashed #ff0;
    padding:1em;
}

.notice-black{
    border: 4px dashed #000;
    padding:1em;