@charset "UTF-8";
/*Standard*/
.hide{display: none;}
.flex{display:flex;}
.icon-listing.book-list li{width: 15em;}
.home .block_top_desktop{display: none;}
* {box-sizing: border-box; vertical-align: middle; }
body { font-family: Verdana, sans-serif;}
h1{color:#23333e}
.background{position:absolute;width: 100%;}
#wrapped{max-width: 1656px; margin: auto;}
div.col2.jamesbone a h1,.cur h1{color:white}


/*New Features*/
.text-centered{text-align: center;}
.flex-container{margin:auto; display:flex; padding:2%; width:80%; justify-content: center; gap:6%; flex-wrap:wrap}
.feature-item{ justify-content: center; width: 13.5em}
.feature-item a{color:black; text-decoration:none;}
.book-card{width:auto}
.book-card img{width:auto; height:20em;}
.price{font-size:.85em;margin-top:2.5em; text-transform: uppercase;}
.price>span{font-size:2em; color:#1d6f9f}
h2.title{font-size:.95em; text-transform:capitalize;}
.book-card>h2 {line-height:140%; text-transform:uppercase;}
a.featured-button {text-transform: uppercase; color:white !important; text-decoration:none; margin:auto; width:3em; background-color:#ea5b3a; padding:.5em 3em; text-align:center;border-radius:1em; margin-top:-2em;}
a.featured-button:hover{background-color: #bb482e;}



/* BOGO Sale*/
.BOGO{border-radius:8px;}
.BOGO .icon-kid-group{width:15em;}
.BOGO.icon-kid a :hover{background-color: transparent;}


/*James Bone*/
.jamesbone{background-image: url(https://gallopade.com/Assets/homepage/JB_Background.png); background-size: cover;}
.book-list img{width: 13em;}
.book-list p{padding: 0em .5em .5em;}
.col2{width:15em; justify-content: center; text-align: center; color:white; text-decoration: none;}
.col2 a{color:white; text-decoration: none;}


/*Shop by Subject*/
.icon-kid{display: inline-block; padding:1em 1em;}
.icon-kid a{ color: #23333e; text-decoration: none}
.icon-kid-group{width:8.5em; padding-top:1em; padding-bottom:.25em; border-radius: 8px;}
.icon-kid a :hover{ background-color: #fdb813;}
.icon-listing ul{ text-align: center; overflow-x: scroll;}
.contained, .icon-listing{ text-align: center; color:#23333e;}


/*Notes*/
.special {margin: 0px; background-color: #144d6f; padding-top: 1em; padding-bottom: .5em; text-align: center;}
.salenote { font-size: 1em; color: white}
.salenote a:hover{ color: #fdb813;}
.salenote a{ color: white;}


/*Banner*/
.salesBanner {max-width: 1656px; text-align: center; background-image: url(https://gallopade.com/Assets/heroimages/Animated-Background_1.gif); background-size: 100%; padding: 1%; margin: 1em auto;}
a .salesBanner h1 {color: white; text-decoration: none; font-size: 18px; font-family: arial, Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";  font-style: normal; margin-top: -2px;}
a .salesBanner strong h1 { font-size: 25px; font-variant-caps: all-petite-caps; margin-top: -4px; color: #00caff;}
a.saleLink {text-decoration: none;}



/*Month of Magic Banner that can also be used for a sales banner*/
.MoM { display: flex; flex-wrap: wrap; text-align: center; color: white; max-width: 1656px; margin: auto auto 1em; justify-content: center;  gap: 2%;}
.MoM .Free { background-image: url(https://gallopade.com/Assets/heroimages/blue_BG_1.gif); border-radius: 8px;}
.MoM .Free strong { color: #00caff; align-items: center; text-transform: uppercase;}
.MoM a { background-image: url(https://gallopade.com/Assets/heroimages/blue_BG_1.gif); color: white; border-radius: 8px; justify-content: center;}
.MoM-Child { width: 17em; justify-content: center; margin-bottom:1em;}
.WSale { margin: 1em;}
.MoM a strong h1 { font-size: 25px; font-variant-caps: all-petite-caps; margin-top: 10px; color: #00caff;  justify-content: center;}

/*Shop by Subject*/
.scroll-hide{display: flex; overflow-x: scroll; scroll-behavior: smooth; gap: 20px; scrollbar-width: none;margin-top:0%;list-style: none;}
.scroll-hide img{width:15em;}
.scroll-hide img:hover{ text-shadow: 2px 2px 4px #000000;}
.flex{display:flex;}

/*Curriculum Banner*/
.cur{background-image: url(https://gallopade.com/assets/branding/collage/v2a.png);background-size: cover;text-align: center;color:white;padding: 3em;}
.cur strong{color:#fdb813;}
.cur .button{background-color: rgba(255, 255, 255, 0.2);width: 9em;margin: auto;padding: .5em;border-radius: 4px;outline: .25em;outline-color: white;}


/* Slideshow*/
.mySlides {display: none;}
img {vertical-align: middle;}


/* Slideshow container */
.slideshow-container {max-width: 1656px; position: relative; margin: auto; background-color: #23333e;}


/* Caption text */
.text { color: #f2f2f2; font-size: 15px; padding: 8px 12px; position: absolute; bottom: 8px; width: 100%; text-align: center;}


/* Number text (1/3 etc) */
.numbertext { display: none;}


/* The dots/bullets/indicators */
.dot { display: inline; height:1em; width:1em;z-index: 9}
.active { background-color: #717171;}


/* Fading animation */
.fade { animation-name: fade; animation-duration: 9s;}
.Mobile {Display: none;}

@keyframes fade {
  from {
    opacity: 0
  }
  to {
    opacity: 1
  }
}

@keyframes slide {
  from {
    x: 0
  }
  to {
    opacity: 1
  }
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 720px) {
  .text { font-size: 11px}
  .Mobile { display: flex;}
  .Desktop { Display: None;}
  .MoM .Free { width: 100%;  margin-bottom: 1em;}
  .MoM-Child a { width: 60%; margin-top: 1em;  }
  .MoM .Free { border-radius: 0px;}
  ul.icon-listing{overflow:hidden; display: inline-block;}
  .flex{display: block}
  .col2.jamesbone{ width:100%; padding:2em;}
}

