@font-face {
  font-family: 'Montserrat Alternates';
  src: url(MontserratAlternates-Regular.ttf);
}

*{
    box-sizing:         border-box;
}

html, body{
    height:             100vh;
    margin:             0;
    padding:            0;
    background-color:   #161a1d;
    font-family:        'Montserrat Alternates','book antiqua', sans-serif;
    color:              #CDCDCD;
    background-image:   url('./img/taoistLady.png'); 
    background-position:left bottom; 
    background-repeat:  no-repeat;
    background-size:    auto 100%;
    background-attachment: fixed;
}

a, a:visited{
    color:              #fff;
    opacity:            0.5;
    transition:         opacity .1s ease-in-out;
    -moz-transition:    opacity 1s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out;
    text-decoration:    none;
}

a:hover, a:focus{
    opacity:            1.0; 
}

h1, h2, h3{
    text-align:         center;
}

.brVis{
    display:            none;
}

footer{
    text-align:         center;
    padding:            20px 0 20px;
    height:             10vh;
}

.bookDescription{
    -webkit-columns:    50px 2; 
    /* Chrome, Safari, Opera */ 
    -moz-columns:       50px 2; 
    /* Firefox */ 
    columns:            50px 2;
    text-align:         left;
}

.container{
    display:            flex;
    margin:             0 auto;
    justify-content:    center;
    align-items:        center;
    width:              50%;
    height:             100vh;
}

div{
    text-align: center;
}

.center{
    text-align:         inherit;
}

@media only screen and (max-width: 600px) {
.bookDescription{
    -webkit-column-count:   auto; /* Chrome, Safari, Opera */
    -moz-column-count:      auto; /* Firefox */
    column-count:           auto; /* standard CSS */
    -webkit-columns:        auto; /* Chrome, Safari, Opera */
    -moz-columns:           auto; /* Firefox */
    columns:                auto; /* standard CSS */
}

div{
    width:              85%;
    text-align:         left;
}

.center{
    text-align:         center;
}

.brVis{
    display:         inline-block;
}
}