@font-face{
    font-family: "OldeEnglish";
    src: url('OldeEnglish.ttf'),
    url('OldeEnglish.ttf'); /* IE */
}

@font-face{
    font-family: "parchment";
    src: url('parchment.ttf'),
    url('parchment.ttf'); /* IE */
}

@font-face{
    font-family: "Heebo-Black";
    src: url('Heebo-Black.ttf'),
    url('Heebo-Black.ttf'); /* IE */
}

@font-face{
    font-family: "Roboto-Medium";
    src: url('Roboto-Medium.ttf'),
    url('Roboto-Medium.ttf'); /* IE */
}



/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) {
    html{
        font-size: 0.58rem;
    }
    #topBar{
        height:50px !important;
        width:95% !important;
    }
    #topBar2{
        width:95% !important;
    }
    .sectionTitle{
        width: 95% !important;
        font-size: 200% !important;
    }
    .topStory{
        width:95% !important;
    }
    .navbar{
        width:95% !important;
    }
    .menu-double{
        width: 95% !important;
    }
    #siteTitle{
        width:100% !important;
        font-size: 600% !important;
    }
    #currentDate{
        font-size: 1.6rem !important;
        /*word-break:break-all;*/
    }
    /*#siteCatchPhrase{
        width:20% !important;
        height: 85% !important;
        font-size: 0.75rem !important;
        border: 2px solid black !important;
        padding: 3px !important;
        margin:3px !important;
    }*/
    #currentVolume{
        font-size: .75rem !important;
    }
    .imageThumb{
        width:80%;
    }

    .headline{
        text-align: center;
        float:left !important;
        padding-right:0px !important;
        /*width:auto !important;*/
        width:100% !important;
        font-size: 200% !important;
    }
    .feed{
        font-size: 1.6rem;
        text-align: center;
        padding-left: 0px !important;
        float:left !important;
        border-left:none !important;
        border-top:1px dashed black;
        padding-left:none !important;
        width:auto !important;
        padding-top: 20px !important;
        font-size: 200% !important;
    }
    #siteCatchPhrase{
        display:none !important;
    }
    #donations{
        display:none !important;
    }
    #currentVolume{
        display:none !important;
    }
    #localWeather{
        display:none !important;
    }
}

/*Small devices (landscape phones, 576px and up)*/
/*THIS IS WHERE WE MAKE THEM STACK
Modify the .feed part of the code...*/
@media (min-width: 576px) and (max-width: 870px) {
    html{
        font-size: 0.85rem;
    }
    #topBar{
        height:65px !important;
    }
    #siteTitle{
        width:100% !important;
    }
    #currentDate{
        font-size: .85rem !important;
        /*word-break:break-all;*/
    }
    #siteCatchPhrase{
        display:none !important;
    }
    #donations{
        display:none !important;
    }
    #currentVolume{
        display:none !important;
    }
    #localWeather{
        display:none !important;
    }
    .imageThumb{
        width:90%;
    }
    .feed{
        padding-left: 0px !important;
        font-size: 1.6rem;
    }
    /*.articleImage{
        max-width:40%;
        max-height: 40%;
    }*/
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 870px) and (max-width: 998px) {
    html{
        font-size: 1rem;
    }
    #siteTitle{
        width:100% !important;
    }
    #siteCatchPhrase{
        font-size: 0.85rem !important;
    }
    .imageThumb{
        width:90%;
    }
    .articleImage{
        max-width:40%;
        max-height: 40%;
    }
    .feed{
        padding-left: 20px;
        font-size: 1.6rem;
    }
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 998px) and (max-width: 1199px) {
    html{
        font-size: 1rem;
    }
    #siteCatchPhrase{
        font-size: 0.95rem !important;
    }
    .imageThumb{
        width:95%;
    }
    .primaryThumb{
        max-width: 400px !important;
    }
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    html{
        font-size: 1rem;
    }
    .primaryThumb{
        max-width: 400px !important;
    }
}
/*4k devices*/
@media (min-width: 2560px) {
    html{
        font-size: 2rem !important;
    }
    #topBar{
        height:160px !important;
    }
    .primaryThumb{
        max-width: 400px !important;
    }
}
  

body{
    line-height:1;
    margin-top: 5px;
    text-shadow: 0px 0px 2px rgba(0,0,0,0.30);
}
#content{
    visibility: hidden;
}
a{
    color:black;
}
a:hover{
    color:black;
}
a:visited{
    /*color:#848484 !important;*/
    color:#848484;
}
.anchor{
    /*display: block;
    position: relative;
    top:250px;
    visibility: hidden;*/
    visibility: hidden;
    position: relative;
    display:block;
    margin-top: -45px;
    padding-bottom: 45px;
}

.imageThumb{
    /*filter: grayscale(100%);*/
    max-width: 300px;
}


#topBar{
    width:80%;
    height:80px;
    /*border: 5px solid black;*/
    border-bottom: 1px solid black;
    margin: 0 auto;
    display:table;
    padding-top: 0px;
    /*vertical align...*/
    display:flex;
    align-items: center;
    justify-content: space-around;
}
#topBar2{
    font-family: 'Roboto-Medium', sans-serif;
    width:80%;
    /*height:80px;*/
    /*border: 5px solid black;*/
    border-bottom: 3px solid black;
    margin: 0 auto;
    display:table;
    padding-top: 0px;
    padding-bottom:2px;
    /*vertical align...*/
    display:flex;
    align-items: center;
    justify-content: space-around;
}
#siteCatchPhrase{
    font-family: 'Roboto-Medium', sans-serif;
    width: 13%;
    text-align: center;
    font-size:110%;
    float:left;
    position: relative;
    border: 2px solid black;
    padding: 3px;
    margin:3px;
}
#siteTitle{
    width:70%;
    font-family: "OldeEnglish";
    /*font-family: 'Heebo-Black', sans-serif;*/
    font-size: 375%;
    text-align: center;
    float:left;
    /*text-shadow: 2px 2px 8px rgb(87, 0, 0);*/
}
#localWeather{
    font-family: 'Roboto-Medium', sans-serif;
    width:13%;
    text-align: right;
    font-size:120%;
    float:right;
    position: relative;
}
#currentVolume{
    float:left;
    /*text-align: center;*/
    text-align: left;
    position: relative;
    width:13%;
}
#currentDate{
    font-style: italic;
    font-size: 110%;
    text-align: center;
    width:70%;
    float:left;
    position: relative;
    line-height: 1.25;
}
#donations{
    font-family: 'Roboto-Medium', sans-serif;
    float:right;
    /*text-align: center;*/
    text-align: right;
    font-size: 75%;
    width:13%;
    position: relative;
}
#donations:hover{
    cursor:pointer;
}
#hiddenDiv{
    display:none;
    text-align: center;
    font-family:"Heebo-Black";
    text-transform: capitalize;
    font-size:150%;
}
#aboutClick:hover{
    cursor:pointer;
}
#about{
    width:80%;
    margin-left: auto;
    margin-right:auto;
    display:none;
    line-height: 1.3;
    text-align: center;
    font-family: 'Roboto-Medium', sans-serif;
    font-size:150%;
    position: relative;
}
#section0Wrapper{
    display:none;
}
#sectionZWrapper{
    display:none;
}
#qrCode{
    width:10rem;
}
nav{
    width:80%;
    margin-left:auto;
    margin-right:auto;
    font-family:"Heebo-Black";
}
.sectionTitle{
    width:80%;
    margin-top: 10px;
    margin-left: auto;
    margin-right:auto;
    /*font-size: 200%;*/
    font-size:150%;
    /*font-family: "OldeEnglish";*/
    font-family:"Heebo-Black";
    text-transform: capitalize;

    background-color: black;
    color: white;
    padding:4px;
}

.sectionTitleLink{
    color:white !important;
    text-decoration: none;
}

.headline{
    font-family: 'Heebo-Black', sans-serif;
    width:50%;
    display:table-cell;
    vertical-align: middle;
    padding-right:20px;
}

.feed{
    font-family: 'Roboto-Medium', sans-serif;
    width:auto;
    /*float: right;*/
    padding-left:20px;
    display:table-cell;
    border-left: 1px dashed black;
    /*vertical-align: middle;*/
}

.topStory{
    width: 80%;
    float:center;
    position: relative;
    align-items: center;
    margin: 0 auto;
    display:table;
    padding-top: 15px;

}

/*.articleText{
    font-size: 110%;
}*/
/*.articleImage{
    float: left;
    margin-bottom: 10px;
    margin-right: 10px;
}*/
.topHeadline{
    text-align: center;
    text-transform: capitalize;
    font-size: 160%;
    margin-bottom: 15px;
    /*border-bottom: 1px solid #000000;*/
    /*padding-bottom: 15px;*/    
}
.headlineLinks{
    font-size:60% !important;
    color:#848484;
}
.headlineLinks a{
    color:#848484;
}
.moreLink{
    font-size: 50% !important;
    background-color: #ffffff;
    color: #000000;
    border-radius: 10px;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    padding: 0 5px 0 5px;
    vertical-align: middle;
}
.remainderLinks{
    font-size:80% !important;
    color:#848484;
}
.remainderLinks a{
    color:#848484;
}
#copyright{
    text-transform: capitalize;
    text-align: center;
    padding-bottom: 20px;
    font-family: 'Roboto-Medium', sans-serif;
}

/*Tools*/
.menu-double{
    width:80%;
    margin-left: auto;
    margin-right:auto;
    margin-bottom: 5px;
    border-bottom: 1px solid black;
    box-shadow: 0px 2px #000000;
}
.double{
    width:80%;
    margin-top: 10px;
    margin-left: auto;
    margin-right:auto;
    margin-bottom: 20px;
    border-bottom: 1px solid black;
    box-shadow: 0px 4px 0px 1px #000000;
}
.dashDouble{
    width:80%;
    margin-top: 10px;
    margin-left: auto;
    margin-right:auto;
    border-bottom: 1px dashed black;
    box-shadow: 0px 4px 0px 1px black;
}
.redBorder{
    /*border: 5px solid red;*/
}
.clear{
    clear:both;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}