body { line-height: normal }
b { font-weight: bold }

#header-logo { color:#333 !important }
#header-logo #brandlogo { display:flex; justify-content: center; align-items: center; flex-wrap: wrap; font-size:12px; max-width:250px }
#header-logo #brandlogo img:not(:first-child) { width:auto; height:20px }

#navbar #header-logo,
#navbar #nav-library li,
#navbar #nav-search li,
#navbar #nav-filter li { height:100px; padding:0 20px; display:flex; align-items:center; justify-content: center; }
#navbar #nav-library i,
#navbar #nav-search i,
#navbar #nav-filter i { margin-left:10px; }

#navbar #nav-search { background:none; border-radius:10px; top:0; left:0; position: relative; z-index: 1}
#navbar #nav-search.popout { position: absolute; top:100px; left:10px; background:#fff; box-shadow:rgb(255 255 255 / 50%) 0px 2px 100px 10px, rgb(0 0 0 / 50%) 0px 2px 4px 1px; width:auto; max-width:100% }
#navbar #nav-search-input { width: 0px;height:32px;margin-left: 0px;padding: 0px;background: none;outline:none;border-width: 0;border-color:#ccc;border-radius: 0px;font-size: 20px;font-family: europa; transition: width 0.8s ease; }
#navbar #nav-search i { font-size: 30px; transform: scaleX(-1) }
#navbar #nav-filter i { font-size: 30px; margin-left: 7px }

#navbar .btn-group { display: block !important; }

#navbar #subtext { position:fixed;top: 110px;width:100%;color: white;font-size: 22px;font-weight: bold;text-shadow: 0 2px 4px rgba(0,0,0,0.5);pointer-events: none }
#padding-top { padding-top:50px; margin:0; display: none }

.sectioncontent .books img { width:auto; border-radius:4px; box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.sectioncontent .books span { margin:10px; display: inline-block; cursor: pointer; position: relative }
.sectioncontent .books .book-empty { width:159px; height:187px; display:flex; align-items:center; justify-content:center; text-align:left; border:4px dashed #fff; text-shadow:-2px 2px 4px #33333340; margin:10px; padding:10px; font-family:'europa', sans-serif; border-radius:4px; }

.books span .fa-heart { position: absolute; width: 0.1px; margin:0; padding:10px; right: 0px; top: 0px; height:0.1px; font-size:0px; text-align:center; color: #fff; opacity:0.9; z-index:2; text-align:center; transition: .2s ease; cursor:pointer; box-sizing:content-box; text-shadow:0 0 5px #33333380 }
.books span:hover > .fa-heart { font-size:22px; height:22px; width: 22px; }
.books span > .fa-heart:hover { color:#ff3434; opacity:1; }
.books span > .fa-heart:active { transform: scale(0.8); transition: unset; }

.fa-heart.faved { color: #ff3434 !important; opacity:1 !important; font-size:16px !important; height:22px !important; width: 22px !important; text-shadow:none }

/*#header-logo::after { content: "TM"; color: #082333; font-size: 7px; font-family: "helvetica", "arial", sans-serif; font-weight: normal; position: relative; float:right; top:0px; left:0px; }
.superscript { color: #082333; font-size: 14px; font-family: "helvetica", "arial", sans-serif; font-weight: normal; position: relative; float:right; top:5px; left:0px; }*/

.boxsection .books-header { padding:50px 0 25px 0; margin:0; text-align:left; text-transform:none; font-family:'europa','helvetica',sans-serif; font-weight:bold; line-height: normal; overflow: hidden; cursor: default; user-select: none }

.button-sort { opacity: 0; font-size:22px; width:36px; height:36px; text-align:center; color:#fff; border:1px solid #fff; border-radius: 10px; padding:6px; transition:opacity 0.3s ease; cursor:pointer; vertical-align: top; margin-top:10px }
.button-sort:hover, .button-sort.selected { background: #fff; color:var(--sky); }
#head-favs span:hover .button-sort, #head-filter span:hover .button-sort { opacity: 1 }

.books-header .button-light,
.books-header .button-dark,
.books-header .button-outline { display:inline-block; position:relative; vertical-align:top; margin-top:8px; border-radius:10px; padding:9px 12px; font-weight:bold; transition:none; font-size:18px; line-height:1; text-shadow:-2px 2px 4px #33333340 }

.books-header .button-light { background: #ffffff40; color:#fff; cursor: pointer }
.books-header .button-light:hover { background: #ffffff60; color:#fff !important; text-decoration: none}
.books-header .button-dark { background: #00000040; color:#fff; cursor: pointer }
.books-header .button-dark:hover { background: #40404040; color:#fff !important; text-decoration: none}
.books-header .button-outline { background: none; color:#fff !important; border:1px solid #fff;padding:8px 12px; cursor: pointer }
.books-header .button-outline:hover { background: #fff; color:var(--sky); text-decoration: none}

.books-header .button-light:active,
.books-header .button-dark:active,
.books-header .button-outline:active { transform: scale(.95) }


#head-filter .appliedFilter { border: none; transition: none;  }
#head-filter .appliedFilter:hover { margin-left:-8px; padding-left:5px; padding-right:5px }
#head-filter .appliedFilter i { display:none }
#head-filter .appliedFilter:hover i {display:inline-block }
#head-filter .appliedFilter[data-cat='pre'] { box-shadow:0 0 0 3px #ffffff80 }
#head-filter .clearSearch.button-dark:not(:hover) { background: none }

#head-filter.sticky { position: sticky; top:55px; z-index:10; pointer-events:none; }
#head-filter.sticky > span:nth-of-type(1) { visibility:hidden }
#head-filter.sticky > span:nth-of-type(2) { position:absolute; top:50px; right:0px; z-index:10; background: #505050cc; z-index:10; border-radius:10px; padding:0 5px; height:46px; transition:.3s ease; pointer-events:auto;}
#head-filter.sticky > span:nth-of-type(2):hover { background: #505050fa }
#head-filter.sticky > span:nth-of-type(2) a { margin-top:5px}
#head-filter.sticky .clearSearch { display:none }

/* sort menu */
#head-filter #sort-order { width: auto; z-index:3; position: relative; text-align: center }
#head-filter #sort-order a { text-decoration: none; backdrop-filter:blur(4px); }
#head-filter #sort-order #sort-menu { position: fixed; height:0px; opacity:0; pointer-events: none }
#head-filter #sort-order #sort-menu.extend { display:block; height:144px; opacity:1; overflow:hidden; transition:opacity .3s ease, height .3s ease; pointer-events: auto }
#head-filter #sort-order #sort-menu a { display:block; margin:0; background:#000000aa; border-radius:0; }
#head-filter #sort-order #sort-menu a:last-child { border-radius:0 0 10px 10px }
#head-filter #sort-order #sort-menu a:hover { background:#000000cc }
#head-filter #sort-order #sort-menu a:active { transform:none }

/* filter search tooltip */
#filterSearchTooltip { all:unset; position:fixed;top: 100px;left: 10px;width:300px; color:#727272; background:#fff;border-radius: 10px;padding: 20px;font-size: 20px;box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%); z-index: 2 }
#filterSearchTooltip #highlightBox { position: fixed; top:0; left:0; padding:10px 0; box-sizing: border-box; pointer-events:none; }
#filterSearchTooltip #highlightBox div { border-radius:10px; height:100%; width:100%; box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%) }
#filterSearchTooltip .button { width:max-content; min-width: 80px; margin:20px auto 0; border-radius: 10px; cursor: pointer; line-height: 1 }


/* Select Books Mode */
.bookWrapper.selectMode:hover .fa-heart,
.bookWrapper.selectMode:hover .edit-title { display:none }
.bookWrapper.selectMode .more-info {margin: 0 0 3px 3px;width:calc(100% - 6px)}
.bookWrapper.selectMode:hover:before,
.bookWrapper.selectMode.selected:before {content:'';position:absolute;top: -2px;left: -2px;height:calc(100% + 4px);width: calc(100% + 4px);border: 5px solid #3af776;border-radius: 5px;z-index:2;}
.bookWrapper.selectMode.selected:before { background:#ffffff60; }
.bookWrapper.selectMode.selected.fas:after {content:'\f00c';position: absolute;top: 0;left: 0;font-size:18px;background: #3af776;padding: 5px; border-radius: 0 0 5px 0;z-index:2;}
.bookWrapper.selectMode:active { transition:none; transform:scale(.95)}
.bookWrapper.selectMode.selected { margin-top:8px; margin-bottom:12px; bottom:-2px }
#select-books-addtocart { transition:box-shadow .3s ease !important }
#select-books-addtocart.highlight { box-shadow:0 0 0 4px #3af776 }
@media (pointer: coarse) {
  .bookWrapper.selectMode .fa-heart,
  .bookWrapper.selectMode .edit-title { display:none }
}

#no-recent img, #no-favs img { box-shadow: none; cursor: default }
#books-filter #no-results { cursor: unset; font-family: 'europa', sans-serif }

#filter { display: block;position: relative; top: -100px; visibility: hidden; margin:0 }

.books { padding:10px; background:#ffffff40; border-radius:10px; width:auto; max-width: max-content; user-select:none }
.books span img { user-select: none; -moz-user-select: none; -webkit-user-drag: none; margin:0; vertical-align: bottom }
.books span a:active { transform: scale(0.95) }
.books span .more-info {  position: absolute; width: 100%; left: 0; bottom: 0; height:0px; font-size:0px; padding-top:0px; opacity:0; color: #fff; background-color: rgba(0,0,0,0.6); z-index:2; text-align:center; font-family: 'europa', 'Helvetica', 'Arial', sans-serif; transition: .2s ease; cursor:pointer; box-sizing:content-box; border-radius:0 0 4px 4px; backdrop-filter:blur(4px); }
.books span:hover > .more-info { font-size:16px; height:30px; padding-top:8px; opacity:1; }
.books span > .more-info:hover { background-color: rgba(0,0,0,0.8); }
    
.books span .edit-title {  position: absolute; border-radius: 50%; width: 0px; left: 5px; top: 5px; height:0px; font-size:0px; padding-top:5px; opacity:0; color: #fff; background-color: rgba(0, 0, 0, 0.6); z-index:2; text-align:center; transition: .2s ease; cursor:pointer; box-sizing: content-box; backdrop-filter:blur(4px); }
.books span:hover > .edit-title { font-size:15px; width:30px; height:25px; padding-top:5px; opacity:1; }
.books span > .edit-title:hover { background-color: rgba(0, 0, 0, 0.8) }

.books a { display: inline-block }

.books.scroll-horizontal { overflow-x: auto; overflow-y: hidden; white-space: nowrap; }
.books.scroll-horizontal::-webkit-scrollbar { height: 12px; border-radius: 10px; }
.books.scroll-horizontal::-webkit-scrollbar-track { background: #f7f8f91c; border-radius: 10px }
.books.scroll-horizontal::-webkit-scrollbar-thumb { background: #f7f8f980; border-radius: 10px }
.books.scroll-horizontal::-webkit-scrollbar-thumb:hover { background: #f7f8f9cc; }

.show-read-more .more-text{ display: none; }
    
@media (pointer: coarse) {
    .books span > .more-info { font-size:16px; height:30px; padding-top:8px; }
    .books span > .fa-heart { font-size:26px; height:42px; width: 28px; }
    #head-filter .appliedFilter span { display:inline-block; }
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-5%; opacity:0} 
  to {top:0%; opacity:1}
}

@keyframes animatetop {
  from {top:-5%; opacity:0}
  to {top:0; opacity:1}
}



#loader { position: absolute; top: 50%; left: 50%; z-index: 1; width: 100px; height: 96px; transform: translate(-50%, -50%); border-radius: 50%; overflow: hidden;}
#loader #c1, #loader #c2, #loader #c3, #loader #c4 { position:absolute; border-radius: 50%; width:100px; height:96px; }
#loader #c1 { transform: scale(0.7); left: -21%; top: 24%; z-index: 104; background: #0E2E41; animation: animatec1 3s ease infinite }
#loader #c2 { transform: scale(0.82); left: -14%;  top: 16.2%; z-index: 103; background: #1A4F70; animation: animatec2 3s ease infinite }
#loader #c3 { transform: scale(0.91); left: -7%; top: 9%; z-index: 102; background: #297AAD; animation: animatec3 3s ease infinite }
#loader #c4 { left: 0%; top: 0%; z-index: 101; background: #40B0E1; animation: animatec4 3s ease infinite }

/* Animation 1 */
@keyframes animatec1 { 10% { left:-70%; top: 70%; } 30% { left:-21%; top: 24%; } }
@keyframes animatec2 { 30% { left:-82%; top: 82%; } 50% { left:-14%; top: 16.2%; } }
@keyframes animatec3 { 50% { left:-91%; top: 91%; } 70% { left:-7%; top: 9%; } }
@keyframes animatec4 { 70% { left:-100%; top: 100%; } 90% { left:0%; top: 0%; } }

/* Animation 2 */
/*
@keyframes animatec1 { 0% { left:-70%; top: 70%; } 15% { left:-21%; top: 24%; } 75% { left:-21%; top: 24%; } 98% { left:-70%; top: 70%; } 100% { left:-70%; top: 70%; } }
@keyframes animatec2 { 0% { left:-82%; top: 82%; } 15% { left:-82%; top: 82%; } 30% {  left:-14%; top: 16.2%; } 75% {  left:-14%; top: 16.2%; } 100% { left:-82%; top: 82%; } }
@keyframes animatec3 { 0% { left:-91%; top: 91%; } 30% { left:-91%; top: 91%; } 45% {  left:-7%; top: 9%; } 75% {  left:-7%; top: 9%; } 100% { left:-91%; top: 91%; } }
@keyframes animatec4 { 0% { left:-100%; top: 100%; } 45% { left:-100%; top: 100%; } 60% {  left:0%; top: 0%; } 75% {  left:0%; top: 0%; } 100% { left:-100%; top: 100%; } }
*/


@media (max-width: 1200px) {
  #padding-top { display: block }
  .button-sort { margin-top:0px }
  .appliedFilter,
  .clearSearch,
  [id^='select-books'] { margin-top:3px !important }
  #head-filter.sticky > span:nth-of-type(2) { height:42px; padding:0 3px}
}
@media (max-width: 1310px) {
  #nav-search-input { transition: none !important }
}
@media (max-width: 950px) {
  #nav-search li span { display: none }
  #nav-filter li span { display: none }
  .fr.full { width:auto !important }
  .navcontent.header_right .dropdown { display:none }
  .navcontent #login { display:none }
}
@media (max-width: 810px) {
  .container div:nth-of-type(2) .sectioncontent { text-align: center !important }
}
@media (max-width: 630px) {
  #header-logo img { content:url('/images/fathom-circle-192.png'); width:40px !important }
  #header-logo #brandlogo div { display:none }
  #header-logo #brandlogo img:not(:first-child) { display:none }
  #header-logo::after { content: "" }
  #header-logo {   padding:32px 15px 28px 15px !important }
  #nav-filter li { padding:30px 15px 34px 18px !important }
  #nav-search li { padding:33px 15px 32px 18px !important }
  #head-filter { width:100%; text-align: center }
}
@media (max-width: 400px) {
  #nav-filter li,
  #nav-search li,
  .navcontent.header_right a { padding-left:5px !important; padding-right:5px !important }
  .navcontent #notif-button { display:none !important }
}


.comingSoon { filter: grayscale(1); opacity: 0.7; }
a[href='javascript:void(0)'] .comingSoon, 
a[href='javascript:void(0)'] .comingSoonBadge { cursor: default }

.books img.comingSoonBadge, .books img.audioComingSoonBadge, .books img.previewFlapBadge { 
  box-shadow: none !important; position:absolute; bottom:0px; right:0px; width:90px !important; height:auto; 
}


.imageLoading { transform: scale(0); opacity: 0; /*position: absolute !important;*/ }

.bookWrapper { transition:opacity 0.2s ease-in-out, transform 0.2s ease-in-out; }


@media (max-width: 950px) {
  .sectioncontent { text-align: center !important }
}



/* Filter Menu */
#filterMenu .dropdown button:active { background:inherit; color:inherit }
#filterRangeInput button.close:hover { background:inherit; color:inherit }
#filterMenu { user-select: none }
#filterMenu * { font-size: 20px }

#filterMenu, #filterMenu .dropdown-menu { position:fixed !important; width: 300px !important; height:305px !important; /* min-height:268px; max-height:calc(100vh - 150px);*/ top: 100px !important; left:287px !important; margin:0 !important; will-change: auto !important; transform:none !important; overflow:hidden auto; border:none; }
#filterMenu { box-shadow:rgba(0, 0, 0, 0.5) 0px 2px 4px 1px;}
#filterMenu .dropdown-item { padding: .25rem 1.5rem .25rem 1rem; white-space:normal !important; text-transform: none !important; font-style:normal !important; border-radius:0; transition:none; }
#filterMenu.hidden, #filterMenu .dropdown-menu.hidden { height:0px; overflow:hidden; box-shadow:none; }
#filterMenu .dropdown-item:hover,
#filterMenu .filter-back:hover { background:#ebebeb !important;}
/* #filterMenu .dropdown:nth-child(even), #filterMenu .dropdown-item:nth-child(even) { background:#f8f8f8 } */
#filterMenu .dropdown-divider { margin:.25rem 0 }
#filterMenu .filter-back { width:100%; font-size:18px; color: #6c757d; cursor:pointer; padding: .25rem 1.5rem .25rem 1rem; }
#filterMenu .filter-back span { font-family: europa, sans-serif; padding-left: 5px }
#filterMenu .filter-back i { font-size: 14px; padding:0 8px}

#filterRangeText { text-align:center;font-size: 20px;width: 100%;padding:20px 0;font-weight: bold;font-family: europa;color: #333;cursor: default; user-select: none}
#filterRangeText > div:nth-of-type(2) { display:inline-block;width: 50px;font-weight:400 }
#filterRangeInputMin,
#filterRangeInputMax { display:inline-flex; align-items:center; justify-content:center; min-width: 100px;height: 75px; border: 1px solid #efefef;border-radius: 10px; position:relative }
.rangeButton { position: absolute; top: -14px; height: 28px; width: 34px; display: flex; align-items: center; justify-content: center; font-size: 16px; color: #33333340; background: #fff; border-radius: 10px; border: 1px solid #efefef; cursor: pointer; }
.rangeButton.button-down { top:unset; bottom:-14px }
.rangeButton:hover { box-shadow:0 0 6px #33333310; color:#333 }
.rangeButton:active { transform:scale(.95) }

@media (max-width: 675px) {
    #filterMenu, #filterMenu .dropdown-menu { left:10px !important; }
}
@media (max-height: 400px) {
    #filterMenu, #filterMenu .dropdown-menu { height:220px !important; }
}

/* More Menu */
#moreMenu .dropdown a:active,
#moreMenu .dropdown button:active { background:inherit; color:inherit }
#moreMenu { user-select: none }
#moreMenu * { font-size: 20px }
#moreMenu, #moreMenu .dropdown-menu { position:fixed !important; width: auto !important; height:auto !important; /* min-height:268px; max-height:calc(100vh - 150px);*/ top: 100px !important; left:587px !important; margin:0 !important; will-change: auto !important; transform:none !important; overflow:hidden auto; border:none; }
#moreMenu { box-shadow:rgba(0, 0, 0, 0.5) 0px 2px 4px 1px;}
#moreMenu .dropdown-item { padding: .25rem 1.5rem .25rem 1rem; white-space:normal !important; text-transform: none !important; font-style:normal !important; border-radius:0; transition:none; }
#moreMenu .dropdown-item:hover,
#moreMenu .filter-back:hover { color:inherit !important; background:#ebebeb !important;}
#moreMenu .dropdown-divider { margin:.25rem 0 }
@media (max-width: 810px) {
    #moreMenu { left:unset !important; right:25% !important }
}


/* Main nav button */
#nav-button { display: flex;padding: 10px 13px;height: 100px;align-items: center;justify-content: center; font-size:30px; color:#333 }

/* Notif Button */
#notif-button { width: auto; height: 100px; font-size: 34px; display: inline-flex; justify-content: center; align-items: center;cursor: pointer; padding: 10px; margin-right: 10px; float:none }
#notif-button #notif-num { display:none; padding: 3px 6px; align-items: center; justify-content: center; background: #ff7070; transform: translate(12px,-15px); border-radius: 99px; min-width: 21px; box-shadow: -1px 1px 4px #00000040; color: #fff; font-size: 12px; position: absolute; width: auto;text-align: center; box-sizing: border-box; transition:transform .3s ease; animation: anim-notifnum .3s ease; }
#notif-button i { vertical-align:top; font-size:30px }
@keyframes anim-notifnum { from { transform: translate(12px,0px) } to { transform: translate(12px,-15px) } }


/* Shopping Cart - navbar */
#cart-button { width: auto; height: 100px; font-size: 30px; display: inline-flex; justify-content: center; align-items: center;cursor: pointer; padding: 10px; margin-right: 10px; }
#cart-button #cart-num { color: #fff;font-size: 12px;position: absolute;transform:translate(2px, -8px);border-radius: 50%;width: auto;text-align: center; transition: transform .3s ease; z-index:1;}
#cart-button #cart-num.sup {  color:#333; animation: anim-cartnum .3s ease; transform:translate(2px, -25px); }
#cart-button:hover #cart-num.sup { color: var(--sky) !important; }
@keyframes anim-cartnum { from { transform:translate(2px, -8px) } to { transform:translate(2px, -25px)} }

/* Shopping Cart */
#shoppingCart .fathom-modal-body { font-weight: normal }
#shoppingCart h1 { margin-bottom: 40px; }
#shoppingCart #cart-booknum { margin-left:20px; margin-bottom:10px}
.fathom-modal .button { background:var(--navy); color:white; padding: 12px 20px; border:none; font-size:20px; font-weight:bold; margin-top:20px; user-select: none }
.fathom-modal .button:hover { background:var(--navy); color:#fff; opacity: .9 }
.fathom-modal .button.outline { background:none; color:var(--navy); border:2px solid var(--navy); padding: 10px 20px; font-weight: normal }
.fathom-modal .button.outline:hover { background:var(--navy); color:#fff; }
.fathom-modal .button.disabled { background:var(--smoke); color: white; padding: 12px 20px; border: none; pointer-events:none; }
.fathom-modal .button:active { transform: scale(.95); transition:none }
.fathom-modal input::placeholder { opacity:.5 }
@media (max-width: 700px) { #shoppingCart .fathom-modal-content { width:90%;} }

#shoppingCart #cart-booklist {height: 298px;max-height:50vh; width: 100%; background: #f3f3f3;border-radius: 10px;overflow: hidden auto;box-sizing: border-box;}
#shoppingCart #cart-booklist table { font-weight:400; margin:0; width:100%; }
#shoppingCart #cart-booklist table tr:nth-of-type(even) { background:#e3e3e3 }
#shoppingCart #cart-booklist table tr:first-child th { padding-top:8px }
#shoppingCart #cart-booklist table tr:last-child th { padding-bottom:8px }
#shoppingCart #cart-booklist table th { padding:4px 20px; line-height: 1.2; font-weight: normal; position:relative }
#shoppingCart #cart-booklist table .info { width:100%; }
#shoppingCart #cart-booklist table th a { cursor: pointer }
#shoppingCart #cart-booklist table tr:hover .info { text-decoration: underline; color:var(--navy) }
#shoppingCart #cart-booklist table tr:hover .remove { display:flex }
#shoppingCart #cart-booklist table tr .remove { display:none; position:absolute; top:0; right:20px; height:100%; align-items:center; justify-content:center; box-sizing:border-box; }
#shoppingCart #cart-booklist table tr .remove a { display:block; padding:3px 6px; font-weight: 300; font-size:16px; background:#fff; color:#555; text-decoration:none; border-radius:8px; box-shadow:0 0 4px #33333340; user-select: none; opacity:.9; }
#shoppingCart #cart-booklist table tr .remove a:hover { color:var(--fathom-red); opacity:1 }
#shoppingCart #cart-booklist table tr .remove a:active { transform:scale(.95) }
#shoppingCart[data-mode="addremove"][data-duration]:not([data-duration="0"]) #cart-booklist table tr .remove { display:none !important }
#shoppingCart[data-mode="addremove"][data-duration]:not([data-duration="0"]) #cart-clear { display:none !important }
@media (pointer: coarse) { #shoppingCart #cart-booklist table .remove { display:flex; } }

#shoppingCart .signin #cart-signin, #shoppingCart .signin #cart-chooseplan { width:25%; }
@media (max-width: 1000px) { #shoppingCart .signin #cart-signin, #shoppingCart .signin #cart-chooseplan { width:50% } }
@media (max-width: 700px) { #shoppingCart .signin #cart-signin, #shoppingCart .signin #cart-chooseplan { width:100%; box-sizing:border-box } }

#shoppingCart .plans #cart-plans { display: flex; justify-content: center }
#shoppingCart .plans #cart-plans > div {display: inline-block;text-align: center; background:#fff; border-radius: 10px; cursor:pointer; transition:.3s ease }
#shoppingCart .plans #cart-plans > div:hover,
#shoppingCart .plans #cart-plans > div.selected { box-shadow:0 0 0 4px var(--navy), 0 0 10px #00000080; opacity:.9 }
#shoppingCart .plans #cart-plans > div:nth-of-type(2) { margin: 0 20px; }
#shoppingCart .plans #cart-plans > div img { width: 50%; margin-top:20px; -webkit-user-drag: none; }
#shoppingCart .plans #cart-plans .currPlanType { background: var(--ocean); color: #fff; padding: 4px 0 6px; border-radius: 4px 4px 0 0; opacity: .66; }
@media (max-width: 900px) { 
    #shoppingCart .plans #cart-plans { display: block; }
    #shoppingCart .plans #cart-plans > div { width:100% }
    #shoppingCart .plans #cart-plans > div:nth-of-type(2) { margin: 20px 0; }
    #shoppingCart .plans #cart-plans > div img { width:25% }
}

#shoppingCart .pricing .school #checkoutStart { transition: background .3s ease }
#shoppingCart .pricing .coupon input { border-radius: 10px 0 0 10px }
#shoppingCart .pricing .couponcode_apply,
#shoppingCart .pricing #addbooks_couponapply { margin:0; background:#11966E; border-radius:0 10px 10px 0; font-weight:normal; position:relative; z-index:5 }
#shoppingCart .pricing .coupon.valid .couponcode_apply:after,
#shoppingCart .pricing .coupon.invalid .couponcode_apply:after { content:'\f058'; font:var(--fa-font-solid); position:absolute; right:calc(100% + 10px); color:var(--fathom-green); animation:anim-coupon-icon .3s ease; pointer-events:none }
#shoppingCart .pricing .coupon.invalid .couponcode_apply:after { content:'\f057'; color:red }
#shoppingCart .pricing .coupon [id$="couponcode_mesg"] { position:absolute; top:100%; left:0; width:100%; font-size:15px; line-height:1 }
#shoppingCart .pricing .coupon.valid [id$="couponcode_mesg"] { color:#11966E }
#shoppingCart .pricing .coupon.invalid [id$="couponcode_mesg"] { color:red }
@keyframes anim-coupon-icon {
  0% { transform:scale(0); opacity:0 }
  100% { transform:scale(1); opacity:1 }
}
#shoppingCart .pricing .button { margin-top:0 }
#shoppingCart .pricing, #shoppingCart .pricing .form-control { font-size: 22px }
#shoppingCart .pricing .form-control { box-sizing: border-box; border-radius: 10px; height:44px; padding:0 12px }
#shoppingCart .pricing .form-row { display: flex; align-items: center; margin-bottom: 20px }
#shoppingCart .pricing .form-row label { margin:0 }
#shoppingCart .pricing table { width: auto; white-space: nowrap; cursor:default }
#shoppingCart .pricing table tr th:nth-of-type(2) { text-align: center; width:100% }
#shoppingCart .pricing .price-table { width:100%; display:inline-flex; justify-content:center; font-size:24px }
#shoppingCart .pricing .price-table.final { font-size: 26px }
#shoppingCart .pricing .price-table.final table tr th:nth-of-type(1) { font-weight: normal }

#shoppingCart .upgrade .price-table { padding:20px 10px; width:100%; border-radius:10px; box-sizing:border-box; font-size:22px }
#shoppingCart .upgrade .price-table tr:nth-of-type(n+3) { border-top:1px solid rgba(0,0,0,0.1) }
#shoppingCart .upgrade .price-table th { font-weight: normal; height:32px; padding:0 4px }
#shoppingCart .upgrade .price-table .price-table-title { text-align:center; font-weight:bold; padding-bottom:20px; font-size:24px }
#shoppingCart .upgrade .currentplan-table tr:not(:first-child) th:first-of-type,
#shoppingCart .upgrade .addedbooks-table tr:not(:first-child) th:first-of-type { font-size:20px; color:#333333cc }
#shoppingCart .upgrade .addedbooks-table input,
#shoppingCart .upgrade .addedbooks-table select { width:100%; text-align:center; border:0; box-shadow:inset 0 0 4px #33333340 }

#shoppingCart .upgrade .addeddetails-table { font-size:18px; padding:20px 0; text-align:center; }
#shoppingCart .upgrade .addeddetails-table table { width:100% }
#shoppingCart .upgrade .addeddetails-table tr { border-color:transparent !important }
#shoppingCart .upgrade .addeddetails-table th { font-weight: bold !important }
#shoppingCart .upgrade .addeddetails-table i { padding-right:4px }
#shoppingCart .upgrade .final-prices { text-align:center }
#shoppingCart .upgrade .final-prices > div:first-of-type { margin-bottom:10px }
#shoppingCart .upgrade .arrow { display:inline-block; position:relative; width: 100%; }
#shoppingCart .upgrade .line { margin-top:8px; width:calc(100% - 20px); background:#333; height:4px; float:left;position: absolute;}
#shoppingCart .upgrade .point { width: 0;  height: 0;  border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 20px solid #333; float:right; }

#shoppingCart .upgrade .newbook-options { margin:1rem 0; padding:20px 0 10px 0; border-radius:10px; background-image:linear-gradient(to bottom, #11966ecc, #11966e40) }
#shoppingCart .upgrade .newbook-options.hidden { display:none !important }
#shoppingCart .upgrade .newbook-option { height:auto; flex-direction:column }

#shoppingCart .upgrade .color-green { color:var(--fathom-green); font-weight: bold !important; }
#shoppingCart .upgrade .color-red { color:var(--red); font-weight: bold !important; }

@media (max-width: 1150px) {
    #shoppingCart .pricing table tr th:nth-of-type(2) { text-align: right }
    #shoppingCart .pricing .price-table { display:flex; width:100% !important; float: none !important }
    
    #shoppingCart .upgrade > table td { display:block; width:100% !important; }
    #shoppingCart .upgrade .addeddetails-table { padding:5px 0; }
    #shoppingCart .upgrade .addeddetails-table table { width:auto }
    #shoppingCart .upgrade .addeddetails-table th { height:auto; font-size:20px }
    #shoppingCart .upgrade .addeddetails-table tr:first-child { display:none }
    #shoppingCart .upgrade .added-details-container { width:100%; margin-left:0 }
}

/* Shopping Cart (fixed) */
:root {
  --fixed-cart-width: 400px;
  --fixed-cart-button-pad: 200px;
}
.fixed-cart .contain { width:calc(100% - var(--fixed-cart-width)) }
.fixed-cart .contain .boxsection { margin:0 50px 50px 50px }

.fixed-cart #shoppingCart { display:flex !important; top:100px; left:unset; right:0; width:var(--fixed-cart-width); height:calc(100vh - 100px); overflow:hidden; box-shadow:0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%); z-index:100 }
.fixed-cart #shoppingCart .fathom-modal-content { width:100%; height:calc(100vh - 100px); border-radius:0; animation:none }
.fixed-cart #shoppingCart .fathom-modal-body { max-height:calc(100vh - var(--fixed-cart-button-pad)); box-sizing:border-box; overflow:hidden auto }
.fixed-cart #shoppingCart .fathom-modal-close { top:5px; right:5px; background:none; color:#333 }
.fixed-cart #shoppingCart .fathom-modal-close:hover { color:var(--fathom-red) }
.fixed-cart #shoppingCart .col-md-7 { flex:none; max-width:100% }

.fixed-cart #shoppingCart .back.button,
.fixed-cart #shoppingCart #cart-clear.button,
.fixed-cart #shoppingCart .button.color-red { position:absolute; bottom:20px; left:20px; }
.fixed-cart #shoppingCart [id*="checkout"].button,
.fixed-cart #shoppingCart [type="submit"].button,
.fixed-cart #shoppingCart #cart-pricing,
.fixed-cart #shoppingCart #addlicenseBtn { position:absolute; bottom:20px; right:20px; }
.fixed-cart #shoppingCart #raq.button,
.fixed-cart #shoppingCart #request_quote_download_signed.button { position:absolute; border:none; font-size:16px; bottom:75px; left:unset; right:20px; padding:5px; margin:0 !important }
.fixed-cart #shoppingCart .button.smaller { position:absolute; border:none; font-size:16px; bottom:75px; left:20px; padding:5px; margin:0 !important }
.fixed-cart #shoppingCart .button.smaller.show-coupon { position:relative; bottom:unset;left:unset;top:unset;right:unset; margin-left:auto !important }
.fixed-cart #shoppingCart .hide-coupon { display:none !important }
.fixed-cart #shoppingCart .button.color-red { color:var(--red); border-color:var(--red) }
.fixed-cart #shoppingCart .button.color-red:hover { background:var(--red); color:#fff }
.fixed-cart #shoppingCart .signin #cart-signin,
.fixed-cart #shoppingCart .signin #cart-chooseplan { width:200px }

.fixed-cart #shoppingCart #cart-booklist { height:auto; max-height:calc(100vh - var(--fixed-cart-button-pad) - 150px); }

.fixed-cart #shoppingCart .plans #cart-plans { display:block }
.fixed-cart #shoppingCart .plans #cart-plans > div { width:100%; background:var(--cloud); }
.fixed-cart #shoppingCart .plans #cart-plans > div:nth-of-type(2) { margin:20px 0 }
.fixed-cart #shoppingCart .plans #cart-plans > div img { display:none }

/*.fixed-cart #shoppingCart .pricing table tr th:nth-of-type(2) { text-align: right }*/
.fixed-cart #shoppingCart .pricing .price-table { display:flex; width:100% !important; float: none !important }
.fixed-cart #shoppingCart .upgrade > table td { display:block; width:100% !important; }
.fixed-cart #shoppingCart .upgrade .addeddetails-table { padding:5px 0; }
.fixed-cart #shoppingCart .upgrade .addeddetails-table table { width:auto }
.fixed-cart #shoppingCart .upgrade .addeddetails-table th { height:auto; font-size:20px }
.fixed-cart #shoppingCart .upgrade .addeddetails-table tr:first-child { display:none }
.fixed-cart #shoppingCart .upgrade .added-details-container { width:100%; margin-left:0 }

/* Get Started Modal */
#getStartedModal .fathom-modal-content { max-width:700px }
.fathom-modal h2 + div.text-light {color: #333333ab !important; line-height:1; margin-top:5px; font-size:18px; font-weight:300}
.fathom-modal .button-group { display:flex; justify-content:center; margin:20px 0 }
.fathom-modal .button-group > div { display:flex; align-items:center; justify-content:center; flex:1 0 30%; background:var(--cloud); text-align:center; height:120px; margin:0 10px;padding: 15px 20px; border-radius:10px; box-shadow:0 0 0 2px #33333340, 0 0 10px #33333320; box-sizing:border-box; cursor:pointer; transition:.3s ease;position: relative; user-select:none }
.fathom-modal .button-group > div:hover { color:#333;box-shadow: 0 0 0 4px var(--navy), 0 0 10px #00000080;}
.fathom-modal .button-group > div:active { transform:scale(.98); transition:none }
.fathom-modal .button-group > div#getStarted-freeTrial { flex:none; height:auto; color:#33333380; }
.fathom-modal .button-group > div.checked { box-shadow: 0 0 0 4px var(--fathom-green), 0 0 10px #00000080; }
.fathom-modal .button-group > div.checked:after { content:'\f058'; font:var(--fa-font-solid); color:var(--fathom-green); position:absolute; top:0; left:0; padding:15px 10px; }

/* Book Sets */
.set-container { display:flex;flex-wrap: wrap;align-items: center;justify-content: center; }
.set-item { width: 50%; padding: 20px; height: 220px; cursor:pointer; transition:.3s ease; } 
.set-item > div { position: relative;overflow: hidden;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;box-shadow: 0 0 10px #00000020;border-radius: 10px; }
.set-text { font-size: 26px; font-family: 'europa', sans-serif; font-weight: bold; line-height: 1; user-select: none; width:100%; height: 100%; background: linear-gradient(#00000000, #272727ab); }
.set-text > div { position: absolute; left:0; bottom:0; width:100%; padding: 20px; text-align: left }
.set-text .sub { font-size: 20px; font-weight: normal;opacity:.75;margin-top:8px }
.set-images { height: 100%; width: max-content; min-width: 100%; position: absolute; left:0; transform: translateX(0%); opacity: .3; z-index: -2; pointer-events: none; -webkit-user-drag: none; user-select: none; transition:.3s ease; }
.set-images img { height:100%; width:auto; float:left }
.set-overlay { background: var(--sky); opacity: .75; height:100%; width:100%; position: absolute; z-index: -1; transition: .3s ease; filter: brightness(.75); }
.set-overlay.no-images { opacity: .75 !important; filter:none !important }
.set-item.w-33 { width:33.33% !important }
    
.set-item:hover { padding:10px }
.set-item:hover .set-overlay { opacity: 0 }
.set-item:hover .set-images { animation: set-scroll 7s ease-in-out infinite alternate; opacity:.6 }
@keyframes set-scroll {
  from {left:0%; transform: translateX(0%);}
  to   {left:100%; transform: translateX(-100%); }
}
@media (max-width: 1000px) { 
    .set-item.w-25 { width:50% !important }
    .set-item.w-33 { width:50% !important }
}
@media (max-width: 700px) { 
    .set-item.w-25 { width:100% !important }
    .set-item.w-33 { width:100% !important }
    .set-item.w-50 { width:100% !important }
}

.head-images {display:flex;align-content: center;justify-content: center;margin-top: 40px;height:220px;width:100%;position:relative; user-select: none; -webkit-user-drag:none }
.head-images img { height:100%; width:auto; position:absolute; box-shadow: 0 2px 10px rgba(0,0,0,0.25); user-select: none; -webkit-user-drag:none }
.head-images img:nth-of-type(2) { top:11px; margin-right:18%; height:90%; z-index:-1 }
.head-images img:nth-of-type(3) { top:11px; margin-left:18%; height:90%; z-index:-1 }
.head-images img:nth-of-type(4) { top:22px; margin-right:36%; height:80%; z-index:-2 }
.head-images img:nth-of-type(5) { top:22px; margin-left:36%; height:80%; z-index:-2 }

#head-filter .sub { font-size:30px; opacity: .75 }
@media (max-width: 1200px) { #head-filter .sub { font-size:25px } }
#head-filter .desc { display:flex; justify-content: center }
#head-filter .desc > div { font-size:24px; font-weight: normal; text-align: left; width:fit-content; max-width: 1200px; line-height: 1; padding:25px 0 }
#head-filter .desc > div ul {font-size:inherit;margin: 1em 0;opacity:.75}
#head-filter .bookset-add-to-cart { font-size:22px; margin:30px 0 }

/* Expired License Modal */
#expiredLicenseModal { text-align: center; }
#expiredLicenseModal .fathom-modal-content { width:550px }
#expiredLicenseModal .fathom-modal-body > div { margin:20px 0 }
#expiredLicenseModal .warningMsg { font-size: 24px; font-weight: bold; color:red; }
#expiredLicenseModal .button { width:50% }
@media (max-width: 600px) {
    #expiredLicenseModal .fathom-modal-content { width: 90% }
    #expiredLicenseModal .button { width:100%; box-sizing: border-box}
}