#reading{
    margin-top: 100px;
    text-align: left;
}

#link-set a{
    font-size: 15px;
    text-decoration: underline;
}

#link-set a:hover{
    text-decoration-style: dotted;
    color: dodgerblue;
}

#link-set a:active{
    text-decoration-style: dashed;
    color: orangered;
}


#link-set a:visited{
    color: darkgrey;
}

#reading .link{
    padding: 3px 15px;
}


.article .image-single img{
    width: 100%;
}


    p.ex-text-a{
        font-family: Abel, sans-serif;
        display: block;
        margin: 0;
        padding: 5px;
        font-size: 17px;
        font-weight: 900;
        color: coral;
        font-style: italic;
        }

    p.ex-text-b{
        font-family: Abel, sans-serif;
        display: block;
        margin: 0;
        padding: 10px;
        font-size: 17px;
        color: black;
        }

    p.ex-text-c{
        font-family: barlow, sans-serif;
        display: block;
        margin: 0;
        padding: 0 5px 50px 5px;
        font-size: 15px;
        color: black;
        }

@media (max-width: 620px) {
    
    #reading{
    padding-left: 5px;
    padding-right: 5px;
    }
    
/*
    .article{
        padding: 5px;
    }
*/
    

    .article .image-set img{
        width: 45%;
        padding: 5px;
        display: inline-flex;
    }
    
    
}

@media only screen and (min-width: 621px) and (max-width: 760px){
  
    #reading{
    padding-left: 5px;
    padding-right: 5px;
    column-count: 2;
    }  
    
    .article{
        padding: 7px;
    }
    
    .article .image-set img{
        width: 100%;
        padding: 5px;
    }
    
}

@media only screen and (min-width: 761px){

    #reading{
    max-width: 1000px;
    padding-left: 20px;
    padding-right: 20px;
    column-count: 2;
    }    
    
    .article{
        padding: 15px;
    }
    
    .article .image-set img{
        width: 100%;
        padding: 5px;
    }
    

}