/* */
/* mobile1st.css--CSS for book page */
/* D. Turcaso 12-Jan-17 */

body {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 1.1em;
    color: white;
    background-color: #00003D; /* This will show up in the margins if the page goes beyond 950px */
}

a {color: lightblue;} /* set links to light blue so they show up against background */

h2,
h3 {margin-top: 10px; margin-bottom: 10px; color: yellow;}
p {margin-top:10px; margin-bottom: 10px;}

.container {
   display: flex;
   flex-wrap: wrap;
   width: 100%;
   background: linear-gradient(#00001F, #00004D, #00001F);
}

.cover, 
.all-text {
   width: 100%;
}

.cover {
   margin: .5em;
   padding: .5em;
   border: solid 1px lightblue;}

.title_info {display: none;} /* Don't show title at smaller screen sizes */
.all-text {padding: 1em;}
.first_p {margin-top: 5px;}

/* The following three divs have to be set in order to display flex */
/* in a column in order to display the textblock and orderlinks in a */
/* different order, depending on screen size*/
.all-text, .orderlinks, .textblock {display: flex; flex-direction: column;}

#new-cover {
   max-width: 100%;
}

.footer-left {
    margin-left: 1em;
    font-size: .8em;
}

@media screen and (min-width: 750px) {
    .textblock {order: 3;}
    .orderlinks {order: 4;}
    .cover, .all-text {width: 45%;}
    .title_info {display: block;} /*make this visible*/
    .title_info {text-align: center;}
}

/* Maximum display width for wide screens */
@media screen and (min-width: 950px) {
    body {
       width: 950px;
       margin-left: auto;
       margin-right: auto;}
}