html, body {
    height: 100%;
    background-color: #1fd4cc;
    font-family: 'Roboto', sans-serif;
    font-size: 100%;
}
h1, h2 {
    color: white;
    font-family: 'Acme', sans-serif;
}

.book-blurb > h1, .book-blurb > h2,
.book-blurb > h1 small, .book-blurb > h2 small {
    color: #337ab7;
    text-shadow: none;
}

h1 {
    text-shadow: .03em .03em 0.5em #0099a8, .03em .03em 0.09em #000;
}

h2 {
    text-shadow: .03em .03em 0.5em #1d7165, .03em .03em 0.09em #000;
}

h1 small, h2 small {
    color: white;
}

h5 {
    padding: 12px 0;
}
a.overlay {
    width: 100%;
    height:100%; position:
    absolute;
    z-index: 99;
}
.black {
    color: black;
    text-shadow: -1px 0px 0 #8a0f0f, -2px -1px 8px #ffffff;
}
.i {
    font-style: italic;
}
.line-through {
    text-decoration: line-through;
}
.container .jumbotron {
    background-color: #dfd66b;
    padding-left: 30px;
    padding-right: 30px;
}
.navbar {
    z-index: 100;
}
.feedback {
    font-family: 'Acme', sans-serif;
    font-size: 132%;
    color: #c91f2b;
    background-color: #fde755;
    border-radius: 0.4em;
}
.feedback span {
    color: black;
}
.flex-alignment {
    display: flex;
    align-items: center;
}
.image-frame {
    box-shadow: inset 0px 3px 6px 0px black;
    background-color: rgb(74, 255, 247);
    padding: 20px 10px 1px 0px;
}
.margin-top {
    margin-top: 15px;
}
.margin-vertical {
    margin-bottom: 15px;
    margin-top: 15px;
}
.padding-vertical {
    padding-bottom: 15px;
    padding-top: 15px;
}
#trustlogo {
    float: right;
    position: relative;
    bottom: 0;
    right: 0;
    z-index: 999;
}
.messages {
    text-align: center;
    list-style: none;
}
.no-margin {
    margin: 0;
}
/* home page */
.title {
    color: #a10000;
    text-shadow: -1px 0px 0 #8a0f0f, -2px -1px 8px #ffffff;
}
.title h1 {
    font-size: 260%;
}
.title h2 {
    font-size: 240%;
}
.top-row {
    padding: 12px;
    background-color: rgba(255, 255, 255, 0.72);
    border: 6px dashed #1fd4cc;
    z-index: 1;
    position: relative;
    box-shadow: 0px 0px 0px 6px #30d7d0;
    flex-wrap: wrap;
}
.top-row:hover {
    box-shadow: 0px 0px 20px 6px #fff inset;
}
.ul {
    text-decoration: underline;
}
 @media (min-width:768px){

    .top-row .book-cover {
        right: 6.666667%;
    }
    .top-row .more-info h2 {
        margin-left: 7%;
        display: inline-block;
        word-spacing: 0.15em;
    }
}
.carousel-indicators {
    bottom: -12px;
}
.top-row .book-cover {
    z-index: 100;
}
.top-row .link-info {
        text-shadow: none;
    z-index: 200;
    position: relative;
    text-align: center;
    padding: 6px;
}
.top-row .link-info a:hover {
    text-decoration: none;
}
.top-row .monster {
    z-index: 101;
    top: 3vh;
}
.top-row .more-info {
    text-align: left;
}


.top-row h4 {
    font-family: 'Acme', sans-serif;
    color: #337ab7;
    text-shadow: none;
}

.feedback p{
    color: #a10000;
    font-size: 106%;
    text-shadow: -1px 0px 0 #8a0f0f, -2px -1px 8px #ffffff;
    margin: 0;
}

.book-title-header {
    color: white;
    background-color: #F20E0E;
    text-shadow: .03em .03em 0em #A81D00, .03em .03em 0.06em #000;
    box-shadow: 0 0 240px -10px #fff, 0 0 4px -1px inset;
    border-radius: 10px;
    padding: 10px 0;
    margin: 30px 10px;
}
.book-title-header h2:first-child {
    font-family: 'Acme', sans-serif;
}

.monster .cover {
    width: 87%;
}
.sherlock .cover {
    width: 60%;
    margin-bottom: 24px;
}
.more-info {
    background-color: #1959a0;
    color: #fff;
    margin-bottom: 30px;
    padding: 6px 12px;
    box-shadow: 0 5px 103px 0px #fff, 0 0 4px -1px inset;
    border-radius: 10px;
    position: relative;
    z-index: 100;
}
.more-info a {
    color: #b8ff7a;
    text-shadow: 1px 1px 16px #333;
}
.thought-bubble {
    background-image: url('../img/red-thought-bubble.png');
    background-repeat: no-repeat;
    height: 268px;
    background-size: contain;
    position: relative;
}
.thought-bubble p {
    color: #fff;
    font-size: 60px;
    position: relative;
    top: 20px;
    right: -36px;
    width: 260px;
}
.sherlock-monster {
    width: 60%;
    position: relative;
    top: -160px;
    right: -60px;
}
.book-link {
    position: relative;
    background-image: url('../img/more-info.png');
    background-repeat: no-repeat;
    height: 290px;
    background-position-x: 60%;
}
.book-link p {
    color: #000;
    font-size: 2.9em;
    position: relative;
    top: 37px;
    left: -43px;
    width: 210px;
}

.buy .book-blurb {
    margin-top: 6%;
}
    #ribbon-container {
        padding: 0 40px;
    }
@media (min-width: 768px) {
    #ribbon-container {
        padding: 0;
    }
}

 @media (min-width:992px){
    .book-blurb, .book-blurb-container {
        box-shadow: 0px 0px 20px -6px #fff;
    }
    .flex-alignment-md {
        display: flex;
        align-items: center;
    }
    #ribbon-container {
        padding: 0 40px;
    }

}

@media (max-width:991px){
    .book-blurb, .book-blurb-container {
        box-shadow: 0px 0px 6px -3px #fff;
    }
    #ribbon-container {
        margin-bottom: 12px;
    }

}

.text-container, .book-blurb, .book-blurb-container {
    background-color: rgba(255, 255, 255, 0.72);
    border-radius: 20px;
}
.text-container a {
    text-decoration: underline;
 }
.book-blurb, .book-blurb-container {
    font-size: 150%;
}

#book-blurb-container {
    padding: 12px 18px;
}
#book-blurb-container span {
    font-weight: bold;
    color: #18569b;
}
.bubble {
    /*width: 1264px;*/
    background: white; /*  that do not support gradients */
    background: -webkit-radial-gradient(circle, white, #60e4de); /* Safari */
    background: -o-radial-gradient(circle, white, #60e4de); /* Opera 11.6 to 12.0 */
    background: -moz-radial-gradient(circle, white, #60e4de); /* Firefox 3.6 to 15 */
    background: radial-gradient(circle, white, #60e4de); /* Standard syntax */
    background: radial-gradient(circle, #fff, #60e4de);
    box-shadow: 0px 0px 8px 12px #fff, 0 0 204px 116px #fff inset;
    border-top-right-radius: 400px;
}
.bubble .wrap {
    height: 426px;
    background-image: url('../img/bubble_sm.png');
    background-repeat: no-repeat;
    background-size: 78%;
    background-position: center;
    padding: 33% 12% 38% 6%;
    position: relative;
}

.bubble .sherlock-monster {
    max-width: 28%;
    position: absolute;
    top: 15%;
    left: 30%;
    z-index: 100;
}

.embed-responsive {
    z-index: 101;
}

@media (max-width : 480px) {
    .top-row .more-info {
        padding: 3px 24px 12px 24px;
        margin: 15px 50px;
    }
}
#reading {
    position: relative;
    top: 40%;
    left: 48%;
    max-width: 42%;
    border-radius: 3px;
    border-bottom-right-radius: 64px;
}

#mid {
    background-color: white;
    border-radius: 10px;
    border: 3px solid black;
}
#mid h2 {
    text-shadow: 0.03em 0.03em 0.01em #1d7165;
    color: #0080f1;
}
#mid ul {
    color: #2D3E6E;
    background-color: white;
    margin-left: -10px;
    border-radius: 20px;
   list-style-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%20Tiny%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11-tiny.dtd%22%3E%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22tiny%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2216px%22%20height%3D%2216px%22%20viewBox%3D%220%200%20500%20500%22%20xml%3Aspace%3D%22preserve%22%3E%20%3Cpath%20d%3D%22M386.161%20258.649l-370.536%20205.915q-6.417%203.627-11.021%200.837t-4.604-10.044v-410.714q0-7.254%204.604-10.044t11.021%200.837l370.536%20205.915q6.417%203.627%206.417%208.649t-6.417%208.649z%22%20fill%3D%22%23000000%22%20%2F%3E%3C%2Fsvg%3E");
}
#mid li{
    padding: 0.4em 5px;
    font-size: 130%;
}

/* ** Contact ** */
.main {
    background-color: white;
    border-radius: 12px;
    padding: 12px;
}

.start {
    font-family: 'Roboto', sans-serif;
    font-size: 260%;
    padding: 0px 23px 0px;
    text-shadow: -1px 0px 0px rgb(149, 147, 147), -2px -1px 0px rgb(66, 61, 61);
    box-shadow: -2px 3px 2px rgba(0, 0, 0, 0.4);
    display: inline-block;
    display: inline-flex;
    align-items: center;
    outline: medium none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    border-radius: 0.5em;
    margin: 1px 0px 5px;
    min-height: 60px;
    color: white;
    background-color: #3A33E7;
    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));

    background: -moz-linear-gradient(top, #2521BC 0%, #3A33E7 50%, #1C1957 100%);
    /*background: -moz-linear-gradient(center top , rgb(68, 68, 68), rgb(0, 0, 0)) repeat scroll 0% 0% transparent;*/
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2521BC', endColorstr='#3A33E7');*/
    background-image: -ms-linear-gradient(top, #2521BC 0%, #3A33E7 50%, #1C1957 100%);
    filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#2521BC', endColorstr='#3A33E7');
        z-index: 100;
    position: relative;
}

.start:hover {
    color: white;
}

.start.blue {
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(37, 33, 188)), color-stop(0.5, rgb(58, 51, 231)), to(rgb(28, 25, 87)));
    font-size: 190%;
}

.start.blue:hover {
    text-decoration: none;
}

.buy .book-blurb p {
    margin: 20px;
}

.buy .more-info {
    margin -12px;
}

.buy #cover {
    transform: rotate(6deg);
    position: relative;
    top: 60px;
    left: -2px;
    z-index: 100;
    border-radius: 9px 9px 7px 9px;
    -webkit-box-shadow: 2px 1px 8px 0px rgb(0, 0, 0), 0px 0px 1px 2px rgb(141, 141, 141) inset;
    -moz-box-shadow: 2px 1px 8px 0px rgb(0, 0, 0), 0px 0px 1px 2px rgb(141, 141, 141) inset;
    -ms-box-shadow: 2px 1px 8px 0px rgb(0, 0, 0), 0px 0px 1px 2px rgb(141, 141, 141) inset;
    -o-box-shadow: 2px 1px 8px 0px rgb(0, 0, 0), 0px 0px 1px 2px rgb(141, 141, 141) inset;
    box-shadow: 2px 1px 8px 0px rgb(0, 0, 0), 0px 0px 1px 2px rgb(141, 141, 141) inset;
}

.buy .book-title-header {
    padding: 12px 7px 16px 32px;
    position: relative;
    z-index: 1;
    /* left: -26px; */
    top: -23px;
    margin: 0;
    border-radius: 7px 0 40px 40px;
}
@media (max-width : 480px) {
    .buy .book-title-header {
        top: -13px;
    }
}

.buy .book-title-header h3 {
    font-size: 18px;
}

.gift-helptext {
    display: none;
}

.more-info form {
    padding: 12px;
}

/*     transform: rotate(24deg);
    position: relative;
    left: -10%;
    top: 100px;
*/

.errorlist {
    box-shadow: 0px 0px 5px 1px rgb(242, 28, 28) inset, 0px 0px 9px -1px #ff5b5b;
    border-radius: 1px;
    list-style: none;
}


.multiple-info {
    font-family: 'Acme', sans-serif;
}
.multiple-info h2 {
    color: black;
    text-shadow: none;
}
/* Purchase completed */
.invoice-display {
    margin-bottom: 12px;
}
.invoice-display tr.table-spacer td {
    padding: 0 12px;
}
.invoice-display td,
.invoice-display th {
    padding: 3px 12px;
}

.info-display {
    background-color: white;
    margin-bottom: 30px;
    padding: 6px 12px;
    border-radius: 10px;
    position: relative;
    z-index: 100;
}