/*********************************************************************/
/**************************      ONE        **************************/
/*********************************************************************/ 
/*

    1) Valid for devices 320px and Up

    Thin         100     
    Extra Light  200
    Light        300
    Regular      400
    Medium       500
    Semi-Bold    600
    Bold         700
    Black        900
    
    spacer = 16px
    p0 = 0px 
    p1 = 4px   spacer * .25
    p2 = 8px   spacer * .5
    p3 = 16px  spacer 
    p4 = 24px  spacer * 1.5
    p5 = 48px  spacer * 3
    
    py = below and above
    px = left and right
     
    MEDIA QUERIES
    xs = 
    sm 
    md
    lg
    xl 
	
	default font size: 16px = 1REM. line-height 1.5;
	
	h1=40px, h2=32, h3=28, h4= 24, h5=20, h6=16
	
    www.browserstack.com
    www.gtmetrix.com
	 
*/

/* -------------------------------------- */
/* ------------ HTML BASICS  ------------ */
/* -------------------------------------- */

a, a:visited, a:link, a:active, a:hover { text-decoration: none; }

body { padding-top: 50px; }
body.body-book-photo-upload { padding-top: 0px; }

.line-height-14 {  line-height: 14px; }
.line-height-16 {  line-height: 16px; }
.line-height-18 {  line-height: 18px; }
.line-height-20 {  line-height: 20px; } 
.line-height-28 {  line-height: 28px; } 
.line-height-30 {  line-height: 30px; } 
.line-height-36 {  line-height: 36px; } 

.bby-burgundy        { color: #800020; }
.bby-text-gold       { color: #e59507; }
.text-dark-red       { color: #8B0000; }   /* css name DarkRed */
 
.bg-dark-red      { background-color: #8B0000; }
.bg-bby-burgundy  { background-color: #800020; }
.bg-bby-oldlace   { background-color: #FDF5E6; }
.bg-antiquewhite  { background-color: ANTIQUEWHITE;} 
.bg-gainsboro     { background-color: GAINSBORO; } 
.bg-ghostwhite    { background-color: GHOSTWHITE;} 
.bg-bby-grey      { background-color: #EEEEEE; } 

a.bby-text-gold { color: #e59507; }
a.bby-text-gold:hover { 
    opacity: 0.6;   
    filter: alpha(opacity=60);    /* For IE8 and earlier */ 
}

#MySpamTrap {display: none;} 
 

img.img-dimmer:hover { 
    opacity: 0.6;   
    filter: alpha(opacity=60);    /* For IE8 and earlier */
}

img.img-shadowed { 
    -moz-box-shadow: 2px 2px 15px #666;
    -webkit-box-shadow: 2px 2px 15px #666;
    box-shadow: 2px 2px 15px #666;
}

.submit-spinner, 
.ff-cell-phone, 
input#cell_phone,
label[for="cell_phone"] { 
    display: none; 
}

#loader-animation,
#loader-animation-sending { 
    display: none; 
}

#loader-animation2 { 
    display:none; 
    text-align: center; 
    padding: 15px 15px;
}

#loader-animation2 > .loader-message {
    font-size: 14px; color: BLUE;
    padding-top: 4px;
    font-weight: bold;
 }
 
.qboxer {
    padding: 15px 15px 10px 15px;
    margin: 20px auto 30px auto; 
    border: 1px solid #e59507;
    border-radius: 10px; 
    -moz-border-radius: 10px;
}

  
/* ==============================================
   Bootstrap 4.5 CSS overrides.
      -- removed checkmark glyhph on valid  
	     form input and select.
   =============================================== */
   
.form-control.is-valid, .was-validated .form-control:valid {
    background-image: none !important;
    padding-right: inherit !important; 
}

/* ------------------------------------------ */
/* ------------ Horizontal Lines  ----------- */
/* ------------------------------------------ */

hr.bby1 { 
   width:94%; 
   color: #C19D6B; 
   background-color: #C19D6B; 
   height: 1px; 
}   

hr.hr1 {
  color: #7F182B;
  background-color: #7F182B;
  height: 1px;
  border-top: 1px solid #8c8b8b;
}

hr.hr2 {
    border-top: 1px solid #8c8b8b;
    text-align: center;
}
hr.hr2:after {
    content: '§';
    display: inline-block;
    position: relative;
    top: -14px;
    padding: 0 10px;
    background: #f0f0f0;
    color: #8c8b8b;
    font-size: 18px;
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    transform: rotate(60deg);
}

/* ==============================================
   Bootstrap 4.5 CSS overrides Top Navigation. 
   =============================================== */ 

/* change the brand and text color */
#mainNav .navbar-brand,
#mainNav .navbar-text {
    color: white;
}
/* change the link color */
#mainNav .navbar-nav .nav-link {
   color: white;
   font-size: 18px;  
   line-height: 20px;
}

#mainNav .navbar-nav .nav-link.disabled {
	color: #DDDDDD;
}
	
/* change the color of active or hovered links */
#mainNav .nav-item.active .nav-link,
#mainNav .nav-item:focus .nav-link,
#mainNav .nav-item:hover .nav-link {
    color: gold;
    font-size: 18px;
    line-height: 20px; 
}

#mainNav .nav-item.active .nav-link.disabled,
#mainNav .nav-item:focus .nav-link.disabled,
#mainNav .nav-item:hover .nav-link.disabled {
	color: #DDDDDD;
}
	
	
/* -------------------------------------------------- */
/* ---------   Bootstrap Override Cards    ---------- */
/* -------------------------------------------------- */

.card-body a {
    font-weight: bold;
}

.card-body a > img:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);      /* For IE8 and earlier */
}
 
/* -------------------------------------------------- */
/* ----  Book Scroller - Next/Previous Buttons   ---- */
/* ----      (book page and preview page)        ---- */
/* -------------------------------------------------- */ 
  
.book-scroller-prev-next {  
    height: 58px; 
    padding: 12px 0 0 0; 
    font-size: 20px;
    width: 130px; 
}
.book-scroller-prev-next a:hover { opacity: 0.50; }
.book-scroller-prev-next .middle-chunk { width: 70px; }

.book-scroller-prev-next .left-chunk, 
.book-scroller-prev-next .right-chunk {  
    width: 30px;
} 
.book-scroller-prev-next .go-next-book-romance, 
.book-scroller-prev-next .go-prev-book-romance { 
    color: #800020; 
}  
.book-scroller-prev-next .go-next-book-classic, 
.book-scroller-prev-next .go-prev-book-classic { 
    color: #734369; 
} 
.book-scroller-prev-next .go-next-book-teen, 
.book-scroller-prev-next .go-prev-book-teen { 
    color: #007f9c; 
} 
.book-scroller-prev-next .go-next-book-kids, 
.book-scroller-prev-next .go-prev-book-kids { 
    color: #00a6aa; 
}
.book-scroller-prev-next .go-next-book-mystery, 
.book-scroller-prev-next .go-prev-book-mystery { 
    color: #4b809b; 
}  

/* -------------------------------------------------- */
/* ----------------   Questionnaire     ------------- */
/* -------------------------------------------------- */

.container-gift-guide .book-title-link { 
    color: black; 
	font-weight: normal;
}

.container-gift-guide .book-title-link:hover { color: #CB274A; text-decoration: none; }

 
/* -------------------------------------------------------------- */
/* -------------------    Shipping Modal    --------------------- */
/* -------------------------------------------------------------- */ 

#shipping-modal .table thead {
   background-color: #8B0000;
}

#shipping-modal .table-bordered td, .table-bordered th {
    border-color: #8B0000 !important;
}

#shipping-modal .table {
  border: 0.5px solid #8B0000;
}
#shipping-modal .table-bordered > thead > tr > th,
#shipping-modal .table-bordered > tbody > tr > th,
#shipping-modal .table-bordered > tfoot > tr > th,
#shipping-modal .table-bordered > thead > tr > td,
#shipping-modal .table-bordered > tbody > tr > td,
#shipping-modal .table-bordered > tfoot > tr > td {
   border: 0.5px solid #8B0000;
}

/* -------------------------------------------------------------- */
/* ---------------------    FAQs Page    ------------------------ */
/* -------------------------------------------------------------- */
 
.body-faqs .accordion .card-header:after {
    font-family: 'FontAwesome';  
    content: "\f068";
    float: right !important; 
	color: #e59507; 
	font-size: 18px;
	line-height: 22px;
	cursor: pointer;
}
.body-faqs .accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\f067"; 
	color: #e59507; 
}


/* -------------------------------------------------------------- */
/* -------------    File Uploader Page    ----------------------- */
/* -------------------------------------------------------------- */

.custom-file-input > .custom-file-label::after {
    content: "Button Text";
}

/* -------------------------------------------------------------- */
/* -------------   Preview Input/Output Page     ---------------- */ 
/* -------------------------------------------------------------- */

.body-book-preview-inputs h2 {
    color: #cca940;
    font-size: 24px;  
    font-weight: bold;  
    font-style: italic; 
}

.container-preview-output-body h5 {
	line-height: 1.3em;
    padding: 2px 0px 2px 6px;
    text-align: left;
}

.container-preview-output-body p { 
    padding: 0px 0px; 
    margin: 0px; 
    line-height: 1.4em;
    text-indent: 32px;
}
 
#preview-email-sent-notification { 
    display: none; 
}

/* -------------------------------------------------------------- */
/* --------------------- RESPONSIVE CSS  ------------------------ */
/* -------------------------------------------------------------- */
 
/* ----Extra small devices (phones, up to 480px) .col-xs ---- */  
   
/* ---- Small devices (tablets, 768px and up)  .col-sm- ---- */
@media (min-width: 768px) {

}

/* ---- Medium devices (desktops, 992px and up) .col-md- ---- */

@media (min-width: 992px) {
    
}


/* --- Large devices (large desktops, 1200px and up) .col-lg- */
@media (min-width: 1200px) { 

}


/*  Retina media query.
    Overrides styles for devices with a 
    device-pixel-ratio of 2+, such as iPhone 4.
-----------------------------------------------    */

@media 
   only screen and (-webkit-min-device-pixel-ratio: 2),
   only screen and (min-device-pixel-ratio: 2) {
    
   body {
    
   }
    
}

/*********************************************************************/
/*********************      END OF DOCUMENT          *****************/
/*********************************************************************/