.banner, .bh3, .bh4, .bh1, .bh2 {
    color : #fff;
    font-family : Arial, Helvetica;
}

.banner {
    background : #000;
    padding : 1px;
    margin : 0;
}

.banner img {
    padding : 5px;
}

.banner table {
    border-collapse : collapse;
    width : 100%;
}

.banner td {
    padding : 4px;
}

/* .bh3, .bh1, .bh2 { */
.xxxbh2 {
    width: 98%;   /* causes ellipsis even on full screen? */
    white-space : nowrap;
    text-overflow: ellipsis; 
    overflow: hidden; 
}


.bh3 {
    float : left;
    font-style : italic;
    font-weight : bold;
    margin-left: 5px;
    margin-right: 20px;
}

.bh3 a {
    text-decoration: none; 
    color: #fff;
}

.bh3 span {
    font-weight : normal;
    font-size : 75%;
}

.bh4 {
    float : right;
    margin-right: 5px;
}

.bh1 {
    font-size : 30px;
    font-weight : bold;
}

.bh2 {
    font-size : 24px;
}

.clear {
    clear : both;
}

@media (max-width: 650px) {
    .banner table {
        margin : 0;
    }
    
    .bh1 {
        font-size : 21px;
    }
    
    .bh2 {
        font-size : 18px;
    }
    
    .bh3, .bh4 {
        font-size : 90%;
        /* margin-right: 0px; */
    }
    
    .banner img {
        padding : 2px;
    }
    
    .banner td {
        padding : 2px;
    }
    
    .banner .hide_small {
        display: none;
    }
}