/* = Framework
----------------------------------------------------------------------------------------------------------------- */
header { padding: 24px 0; background: #fff; }
footer { padding: 10px 0 0; margin-bottom: 30px; color: #222; }

.container { width: 1150px; margin: 0 auto; padding: 0 25px; position: relative; }

@media screen and (max-width:1200px) {
    .container {
        width: 100%;
    }
    
}

@media screen and (max-width:440px) {
    .container {
        padding:0 20px;
    }
    
}

/* = Templates
----------------------------------------------------------------------------------------------------------------- */
.template { padding-top: 40px; padding-bottom: 40px; }

.template2col section { width: 60%; float: left; }
.template2col aside { width: 35%; float: right; }
.template2col aside img { float: right; margin: 8px 0 6px 14px; }

.template2col aside .box { border-bottom: 1px solid #DADAD8; margin-bottom: 30px; padding-bottom: 10px; }
.template2col aside .box h2 { font-size: 1.4em; margin-bottom: 14px; }
.template2col aside .box:last-child { border: 0; margin-bottom: 0; padding-bottom: 0; }

/* = Logo
----------------------------------------------------------------------------------------------------------------- */
.logo { display: block; margin:0 auto 30px; padding:15px 0; font-size: 1.8em; font-weight: 600; text-align: center; border:2px solid #222; border-width: 2px 0; max-width: 1100px; font-family: "Playfair Display", serif; }
.logo-tag {  font-family: "Source Sans 3", sans-serif; display: block; font-weight: 400; }

@media screen and (max-width:440px) {
.logo {  margin:0 auto 20px; }
}

/* = Menu
----------------------------------------------------------------------------------------------------------------- */

.menu { margin:0 auto 10px; max-width: 1100px; }
.menu ul {
display: flex; justify-content: center; align-items: center; gap:0; margin: 0;
}
.menu ul li { font-weight: 300; font-size: 1.5em; list-style: none; margin:0; padding:0; display: inline-flex;}
.menu ul li:not(:last-child):after { content:'-'; padding: 0 12px; margin: 0 12px;}
.menu ul li a { display: block; font-weight: 400;}
.menu ul li.liOn a { text-decoration: underline; text-underline-offset: 3px;}

.contactBox { margin:30px auto 0; padding:15px 0; border-top:1px solid #222;  max-width: 1100px; display: flex; justify-content: space-between; }
.contactBox p {  color: #222; margin:0; line-height: 1; }
.contactBox a { color: #222; }
.contactBox a:hover { color: #333; text-decoration: underline;}
.contactBox .menuTel a { color: #222; }

@media screen and (max-width:480px) {
    .contactBox {
        padding: 12px 0;
        font-size: 14px; letter-spacing: -0.25px;
    }

    .menu ul li { font-size: 1.25em;  }
    .menu ul li:not(:last-child):after { padding:0; margin: 0 12px;}

}

@media screen and (max-width:440px) {
.contactBox {
        padding: 10px 0;
        font-size: 12px; letter-spacing: -0.35px;
    }
}

/* = Cookie
----------------------------------------------------------------------------------------------------------------- */
.cookie { display: none; padding: 10px 0; color: #fff; text-align: center; font-size: 0.9em; background: #434343; }
.cookie p { margin: 0; font-size: 1em; }
.cookie p a { color: #fff; text-decoration: underline; font-weight: bold; }

/* = To sort
----------------------------------------------------------------------------------------------------------------- */
.homeIntro {  margin: 0 0 30px;padding:25px; border:1px solid #ccc; }
.homeIntro p { font-weight: 400;  }
.homeList .cols { margin-bottom: 0; }

.featuredBooks ul { list-style: none; margin: 0; list-style: none; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.featuredBooks ul li { float: left; width: 32%; margin-right: 2%; margin-bottom: 2%; padding: 10px; vertical-align: top; border: 1px solid #d6d6d6; min-height: 170px; position: relative; }
.featuredBooks ul li:nth-child(3n+3) { margin-right: 0; }
/*.featuredBooks ul li:nth-last-child(-n+3) { margin-bottom: 0; }*/

.featuredBooks ul .featuredThird { margin-right: 0; }
.featuredBooks .addToBasket { position: absolute; bottom: 12px; right: 12px; }

.featuredBooks .featuredBookImage { display: block; position: absolute; width: 90px; float: left; height: 100%; top: 0; left: 10px; padding: 10px 0 0; box-sizing: border-box; }
.featuredBooks .featuredBookTitle { font-size: 1.1em; line-height: 1; color: #222; }
.featuredBooks .featuredBookTitle:hover { color: #CAD1D6; }

.featuredBooks .featuredBookContent { margin: 0 0 46px 100px; }
.featuredBooks .featuredBookDate { display: block; color: #888; margin: 8px 0 12px; font-weight: 400; font-size: 1.4em; }

.headerSearch { max-width: 1100px; margin:0 auto;   transition: all 0.1s ease-in-out; }
.searchWrapper { flex:1; display: flex; }
.searchWrapper .msgError {     margin: 10px 10px 0 0; }

.headerSearchPre {     display: flex; flex-wrap: wrap; align-items: center; gap: 15px;}
.headerSearch .searchbarTitle { line-height: 1; font-size: 1.2em; margin:0; }
.headerSearch h2 a { font-size: 0.7em; margin: 5px 0 0; display: block; text-transform: none; color: #333; font-weight: bold; }
.headerSearch input.text { padding: 8px 12px; width: 32.5%; margin-right: 0.5%; }
.headerSearchPre .msg { flex:0 0 100%; }

@media screen and (max-width:800px) {
   .headerSearchPre {
    flex-wrap: wrap;
   }

   .headerSearchPre h2 {
        flex: 0 0 100%;
   }
    
}


@media screen and (max-width:480px) {
.searchWrapper { display: block;}
.headerSearch input.text { width: 100%; margin: 5px 0 0;}

input.btn { margin-top:10px;}
    
} 

@media screen and (max-width:480px) {
.homeIntro {  padding:22px; }
}



.searchCols { margin: 25px 0 0; display: flex; }
.searchCols .col { border:1px solid #333;}
.searchCols .webForm { padding: 30px; margin:0; }
.searchCols h2 { font-size: 1.25em; padding: 15px;  margin:0; border-bottom: 1px solid #333; line-height: 1; background: #F9F9F9;  }
.searchCols label { font-weight: 400; float:none; padding:0; margin: 0 0 5px; width: 100%; display: block;}
.searchCols input,
.searchCols select { float:none; width: 100%; margin:0; }
.searchCols .webForm div  { margin-bottom: 15px;}
.searchCols .webForm .advSearchbtn { margin: 25px 0 0; }

ul.alpha { list-style: none; margin: 0; display: flex; gap: 10px; flex-wrap: wrap; }
ul.alpha li { margin:0; width: 28px; height: 28px; line-height:28px; color: #666; background-color: #f2f2f2;  display: flex; justify-content: center; align-items: center;  }
ul.alpha li a { display: flex; justify-content: center; align-items: center; width:28px; height: 28px; color: #333; border:1px solid #333; background-color: #fff;  }
ul.alpha li a:hover, ul.alpha li a.on { color:#fff; background: #333; }

.CategoriesList ul { margin: 0; list-style: none; }
.CategoriesList ul li { margin: 0 0 12px 0; }

.CategoriesList.CategoriesListAdvanced ul { margin: 20px 0 30px; }
.CategoriesList.CategoriesListAdvanced ul:last-child { margin-bottom:0; }
.searchCols .CategoriesList ul li a { font-size: 1.1em; }

.CategoriesList ul li a { color: #222; font-weight: 600; font-size: 1.1em; padding-left: 42px; background: url(/_img/bullet_r.png) no-repeat bottom left; display: block; }
.CategoriesList ul li a:hover { background-position: top left; }
.CategoriesList ul li a:hover { color: #CAD1D6; background: url(/_img/bullet_g.png) no-repeat bottom left; }

.BooksList .searchedTitle { margin-bottom: 6px; font-family: "Playfair Display", serif; font-weight: 400; color: #CAD1D6; line-height: 1.35em; }
.BooksList .searchedTitle a { color: #222; }
.BooksList .searchedTitle a:hover { color: #333;  text-decoration: underline;}
.BooksList span.extraInfo, .BooksList .extraInfoTitle { color: #CAD1D6; display: none; }
.BooksList .priceMagenta { color: #222; }

.BooksList .leader { color: #000; }
.BooksList .leader span { color: #333; }
.BooksList .extraInfoTitle { font-weight: bold; margin-bottom: 4px; color: #333; }



#printarea hr { margin: 20px 0; }


footer .leader { color: #222; margin: 0; display: flex; align-items: center; }
footer a { color: #222; }

footer .leader .midDot { margin: 0 20px; }
footer .footerAddress { color: #000; margin: 16px 0 0; padding: 15px 0; flex:0 0 100%; border:1px solid #333; border-width: 1px 0;}

footer .container { text-align: center;   }

.footer-inner { border-top:2px solid #222; padding-top: 25px; display: flex; flex-wrap: wrap; justify-content: center; }

footer .contactInline a { color: #222; }
footer .contactInline a:hover { color: #444; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }

footer .leader span:not(.midDot) { color: #222;
    border-radius: 2px;
    width: 21px;
    height: 20px;
    margin-right: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #333; }
footer .fa {      font-size: 12px;  color: #fff; }

.cover { background: #111; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; opacity: 0.6; display: none; }

.book-cats {
    display: flex;
    flex-wrap: wrap;
    gap:20px;
    margin:30px 0 0;
    list-style: none;
    padding:0;
}

.book-cats li {
    width: calc(25% - 15px);
    margin: 0;
    border: 1px solid #222;
    display: flex;
    font-weight: 400;
    font-size: 1.2em;
    border-radius: 2px;
}

.book-cats li a { 
    flex:1;
    display: block;
   padding: 20px;
   text-align: center;
   transition: all .25s ease;
}

.book-cats li a:hover,
.book-cats li a:focus {
    color:#fff;
    background-color: #333;
}

.book-cats-list {
    list-style: none; margin:0; padding:20px;
}

.book-cats-list  li {
    margin: 0;
    padding:0;
    border-bottom: 1px dotted #bababa;
    font-weight: 400;
    line-height: 1;
}
.book-cats-list  li:last-child { border:none;}
.book-cats-list  li a { display: block;     padding: 7px;}
.book-cats-list  li a:hover {
    background-color: #efefef;
}

#contact section,
#about section {
    padding:25px; border:1px solid #ddd; font-weight: 400;
}


.BooksView { padding: 25px;
    border: 1px solid #ddd;
    font-weight: 400;
}

.BooksView h1 { text-wrap: balance; margin-bottom: 25px;}
.BooksView__meta p {  
     margin: 12px 0;
    line-height: 1;
    display: flex;

    overflow: hidden;
    border: 1px solid #ddd;
}

 .BooksView__meta p > * { align-self: center;}

.BooksView__meta p b {     
    flex: 0 0 200px;
    padding: 12px 15px;
    margin-right: 15px;
    border-right: 1px solid #ddd;
    font-weight: 600;
    align-self: auto;

 }

 .BooksView__meta p span {
padding: 10px 15px 10px 0;

 }

 .BooksView__meta p [itemprop]  {
    padding-right: 5px;
 }

  .BooksView__meta p [itemprop]:last-child {
    padding-right: 15px;
  }

.other-books {
    margin: 30px 0 0;
}

.other-books ul {
    list-style: square;
}

.other-books li:last-child {margin-bottom: 0;}

.other-books a:hover { text-decoration: underline;}

.searchFilters {
    border: 1px solid #222;
    border-width: 1px 0;
    margin: 30px 0;
    padding: 15px 0;
    display: flex;
}

.searched-terms {
    margin-left: 30px;
}

@media screen and (max-width:1024px) {
        .book-cats {
        gap: 22.5px;
    
    }
    .book-cats li {
        width: calc(33.333% - 15px);
    }
}

@media screen and (max-width:800px) {
        .book-cats {
        gap: 20px;
    
    }
    .book-cats li {
        width: calc(50% - 10px);
    }
}

@media screen and (max-width:800px) {
        .book-cats {
        gap: 15px;
    
    }
    .book-cats li {
        width: calc(50% - 7.5px);
    }

    .book-cats li a {
        padding:15px;
    }

    .searchCols {
        display: block;
    }
    .searchCols .col {
        float:none; width:100%;
    }
    .searchCols .col:last-child {margin-top: 30px;}

    .searchCols label  { line-height: 1;}
}

@media screen and (max-width:600px) {
    .footer-inner { display: block;}
    footer .contactInline { display: block; }

    .footer-inner .midDot {  display: none;}
    footer .footerAddress { text-align: left;}

    ul.alpha { gap:8px;} 
    ul.alpha li { width:24px; height: 24px; line-height:24px;   }
    ul.alpha li a { width:24px; height: 24px;   }

    .BooksView { padding:0; border:none; }
    .BooksView__meta p { display: block; padding:15px; }
    .BooksView__meta p:last-of-type { margin-bottom: 0;}
    .BooksView__meta p b { display: block; margin:0 0 5px;padding:0; border:none; }
    .BooksView__meta p span { padding:0; }

}

@media screen and (max-width:440px) {
   .book-cats li {
        font-size: 1em;
        line-height: 1;
    }

    .book-cats li a {
        padding:12px;
    }

    footer .leader { font-size: 1.25em;}

    footer .footerAddress { font-size: 14px; padding:10px 0;}

    #contact section, #about section {
        padding:0;
        border:none;    
    }

    .searchCols .webForm { padding: 25px 20px; } 
    .book-cats-list { padding:15px;}
    .searchCols label { line-height: 1;}
}