
@media all and (max-width:1140px) {


}

@media all and (max-width:1024px) {

.green-bg {padding:4rem 0;}
.greenDark-bg {padding:4rem 0;}
.texture-bg {padding:4rem 0;}
.maroon-bg {padding:4rem 0;}

#menu .navbar-nav > li > a {font-size:0.7rem; padding:0 15px;}
header.sticky-header .header-container #menu .navbar-nav > li > a {font-size:0.7rem;}

.banner-section .carousel-inner .img-fluid {
    height:100%;
    aspect-ratio:1 / 1;
    object-fit:contain;}
.banner-section {height:100%;}	
.banner-section .carousel {height:100%;}	
.banner-section .carousel-inner {height:100%;}	
.banner-section .carousel-inner .carousel-item {height:100%;}	
.banner-section .carousel-inner .carousel-item {height:100%;}	
.banner-section .carousel-inner .row.justify-content-center {height:100%;}	

.began-with {gap:50px;}
.began-with:after {bottom:-4.5rem;}
.began-with .column-left {width:50%; max-width:100%;}
.began-with .column-right {width:50%;}
.began-with .content-left .ytext .img-wish {position:absolute;
        right: 30px;
        top: -20px;
        display: inline-block;
        max-width: 170px;}
.began-with .column-right {width:50%;
        font-size: 0.8rem;
        line-height: 2;
        font-weight: 600;
        display: block;}	
.featured-products .owl-carousel .owl-nav button.owl-prev {left:-30px;}			
.featured-products .owl-carousel .owl-nav button.owl-next {right:-30px;}
.featured-products .product-thumb .description h4 {margin: 1rem auto 0; font-size: 1.2rem;}


.quote-section .blockquote {font-size:2rem; max-width:80%;}
.quote-section .blockquote .qoute.left {left:-60px;}
.quote-section .quote-auther {font-size:0.9rem;}
.birthday-block h3 .birthday-text {font-size:80px;}
.personalized-storybook h2 {margin-top:1rem; font-size:2rem;}
.testimonial-module .testimonial-header h2 {font-size:2.2rem;} 
.testimonial-module .testimonial-item .testimonial-text {line-height:2rem; font-size:1rem;}

.banner-container .home-bannerLeft {width:100%;}
.banner-container .home-bannerRight {width:100%;}

.sideCol-content .text-container {padding:1.5rem;}
.your-story .bug-icon:after {bottom:-4.4rem;}
.quote-section.ys-quote .blockquote .qoute.left {left:-30px;}
.sideCol-content .text-container .content-inner {width:90%;}
.sideCol-content .text-container h4 br {display:none;}
.sideCol-content .text-container ul {gap:15px;}

.our-story .began-with .content-left .ytext .img-wish {	
	position:absolute;
    right:0;
    top:-2rem;
    display:inline-block;
    max-width:12.5rem;}
.purple-roundbg:after {top:-2px;}	
.container-illustrator .column-left .text-wrap-container {bottom:-55px;}
.container-illustrator .column-right {padding:3rem 0 0 4rem;}
.team-module .team-content {margin:4rem auto 2rem;}

#product-info .banner-detail .detail-bleft {width:60%;}
#product-info .banner-detail .detail-bright {width:40%;}
#product-info .banner-detail .banner-container .banner-caption {padding:0 0 0 30px;}

.login-container .login-box {padding:30px 18px; font-size:14px;}
.login-box h2 {font-size:24px; margin:0 0 15px;}

#account-register .login-container .login-box {width:100%;}
#account-register .login-box h1 {font-size:2rem;}

#account-forgotten .login-container .login-box {width:100%;}
#account-forgotten .login-box h1 {font-size:2rem;}
#container {
    width: 100%;
    min-height: 100%;
    position: relative;
    margin-bottom:0;}

.privacy-main section.whiteBG-circle {padding:3rem 0;}
.privacy-middle .pp-left {max-width:70%;}
.privacy-middle .pp-right {max-width:34%;}
.privacy-middle .pp-right .privacy-right-bg {max-width:100%;}

.faq-middle {width:100%; max-width:90%;}
.ques-ans { padding-right:3rem;}


}


@media all and (max-width:991px) {

#container {overflow-x: hidden;}
.banner-section .carousel-inner .img-fluid {object-fit:cover;}



.began-with {gap:0; flex-direction:column; align-items:flex-start; justify-content:flex-start; width:100%;}
.began-with .column-left {
        width:100%;
        max-width:100%;}
.began-with .column-right {
        width:100%;
        font-size:0.8rem;
        line-height:2;
        font-weight:600;
        display:block;}		
.began-with .content-left .ytext .img-wish {right:inherit;}
.began-with .column-right {font-size:1rem;} 		
.banner-container .banner-caption .description h4 {font-size:1rem; line-height:1.6rem;}
.banner-container .banner-caption .description p {font-size:1rem;}
.banner-container .banner-caption .description {font-size:1rem; line-height:1.6;}
.birthday-book-section .birthday-block {flex-direction:column;}
.birthday-book-section .birthday-block .customb-left {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
	margin-bottom:5rem;}
.birthday-book-section .birthday-block .customb-right {
    position: relative;
    width: 100%; padding:0;}
.birthday-block .right-section {max-width:100%;}
.birthday-block .customb-left img.birthday-img {
    margin: 0 auto;
    max-width: 90%;}		
.birthday-block h3 .birthday-text {font-size:100px;}	
.birthday-block .right-section p {
        font-size:1.3rem;
        line-height:1.8;}
.testimonial-panel .testimonial_right {
    position:relative;
    padding:0;
	order:1;}		
.testimonial-module .testimonial-image {
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto;
    padding:0 0 50px;
    text-align:center;
    position:relative;
    right:0;
    top:0;
    left:0;}		
.testimonial-module .testimonial-header h2 {
        font-size:2.2rem;
        text-align:center;
        margin:0 auto 20px;}	
.testimonial-module .testimonial-content {
    position:relative;
    display:block;
    padding:0 0 0 60px;}	
.testimonial-panel .testimonial_left {padding:0; order:2;}	
.testimonial-module .testimonial-content:before {left:0;}
.testimonial-content .owl-theme .owl-nav.disabled+.owl-dots {
        margin:10px auto 30px;
        text-align:center;}
.testimonial-panel .testimonial-header {display:none;}		
.testimonial-panel .mobile-testiHeader {display:block;}		
footer {padding:3rem 0 2rem;}
footer .footer-col.col-one {
    width: 100%;
	border-top: none;
    padding-top: 0;
    padding-right: 0;
    padding-left: 0;
    margin: 0 auto;}
footer .footer-col {
    width: 100%;
    padding: 2.5rem 0 0;
    font-family: var(--primaryFont);
    margin: 0 auto 30px;
    text-align: center;
    border-top: 1px solid #293757;}	
footer .copyright {text-align:center !important;  padding:2rem 0 0.5rem; border-top:1px solid #293757;}
.footer-col h5 {font-size:1.2rem;}
.footer-col ul li {
    font-size: 1rem;
    line-height: 1.4;
    margin: 0 0 15px;
    padding: 0;
    display: block;
    font-weight: 600;}
.footer-col ul li a, .footer-col .country-line, footer .copyright {font-size: 0.9rem; text-align: center !important; font-weight:500;}

.footer-col .country-line {border-top:1px solid #293757; padding-top:2rem;}

.personalized-storybook .steps-container .step.step-middle {display:none;}
.personalized-storybook .steps-container {
    position: relative;
	margin-top: 40px;
    z-index: 9;
    display: flex;
    gap: 0;
    width: 100%;
    max-width: 100%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;} 
.steps-container .step .blob-shape {
    background: #FFF3E8B2;
    display:flex;
    align-items: flex-start;
    justify-content:flex-start; text-align:left;
    flex-direction: column;
    position: relative;
    margin:0 auto;
    padding:25px;
    min-height: 120px;
    height:auto;
    background-size: 100%;
    border: 1px solid #FFDCBC;
    border-radius: 20px;}	
.personalized-storybook .steps-container .step.step-1 {max-width:100%;}	
.personalized-storybook .steps-container .step {
    width: 100%;
    height: auto;
    position: relative;
    text-align: left;
    max-width: 100%;
    margin:0 auto 50px !important;
    z-index: 9;}	
.personalized-storybook .steps-container .step.step-1 .blob-shape {
    height: auto;
    background-size: 100%;
    width: 100%;
    top:0 !important;}		
.personalized-storybook .steps-container .step:before {display:none!important;}

.personalized-storybook .steps-container .step .blob-shape .step-index {top:-20px !important; left:20px !important;}	
.personalized-storybook .steps-container .step.step-1 {order:3;}
.personalized-storybook .steps-container .step.step-2 {order:2;}
.personalized-storybook .steps-container .step.step-3 {order:4;}
.personalized-storybook .steps-container .step.step-4 {order:1;}
.personalized-storybook .steps-container .step.step-5 {order:5;}
.steps-container .step .step-title {
        font-size: 1.2rem;
        text-align: left;
        margin: 10px 0;
        display: block;
        width: 100%;
        font-weight: bold;}
.steps-container .step .step-description {
        font-weight: 500;
        font-size: 0.85rem;
        display: block;
        margin: 0;
        padding: 0;
        text-align: left;
        line-height: 1.6;}	

.header-container .logo_header {
        width:40%;
        padding:0;
        order:1;}		
.header-container .menu_header .headerMenu {float:right;} 			
.header-container .menu_header {
        width: 10%;
        order: 3;
        padding: 0;
        margin: 0;}
.header-container .search_header {
        width: 50%;
        order: 2;
        padding: 0 15px !important;
        margin: 0;}		
.headerMenu #menu {position:relative;}		
.headerMenu #menu button:focus:not(:focus-visible) {outline:0;
    box-shadow:none;}
.headerMenu #menu .navbar-collapse {
    position:absolute;
    top:60px;
    right:0px;
    display:block;
    min-width:200px;
    z-index:999;
    padding:0;
    background:#fff;
    opacity: 0;
    visibility: hidden;
    border-radius:2px;
	transition:all .4s;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	transform: translateY(-20px);}
.headerMenu #menu .navbar-collapse:before	{content: '';
    width: 0;
    height: 0;
    border-top:10px solid transparent;
    border-bottom:10px solid #fff;
    border-left:10px solid transparent;
    position: absolute;
    right: 10px;
    top: -19px;
    border-right: 8px solid transparent;}
.headerMenu #menu .navbar-collapse.collapse.show {opacity:1; visibility:visible; transform: translateY(0px);}	
.headerMenu .navbar-toggler {padding:0; padding: 0;
        position: absolute;
        right: 0;}
.headerMenu .navbar-toggler-icon {filter:brightness(10); 
	width:2.5em;
    height:2.5em;}	

.headerMenu #menu .navbar-nav {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    text-align: left;
    padding: 0;
    margin: 0 !important;
    flex-direction: column;}
.headerMenu #menu .navbar-nav .nav-item {
    display: block;
    width: 100%;}
#menu .navbar-nav > li > a {
        font-size: 0.9rem;
        padding: 12px 15px;
        text-align: left;
        display: block;
        width: 100%;
        border-bottom:1px solid #ddd;
        text-transform: uppercase;
        font-weight: 600;
		background-color:#fff;}	
#menu .navbar-nav > li > a:hover {color:var(--blueTop); border-bottom:1px solid #ccc;} 
.headerMenu .navbar-toggler-icon {background:url('../images/mobile-toggle.svg') no-repeat left top; 
		width:30px;
        height:23px;
        display: inline-block;
        margin: 0;
        padding: 0;
        background-size:100%;}	
.unique-crafted h6 {font-size:1rem;}
.quote-section.ys-quote .blockquote {font-size:1.7rem;}
.quote-section.ys-quote .blockquote .qoute.left {left:-15px;}	
.sideCol-content .text-container .content-inner {width:100%; gap:15px;}
.sideCol-content .text-container h4 {font-size:1.5rem; line-height:1.3;}
.sideCol-content .text-container ul {gap:10px;}
.sideCol-content .text-container ul li {font-size:0.8rem;}
.sideCol-content .text-container ul li:before {
    content:"";
    width: 1rem;
    height: 12px;
    display: inline-block;
    background-size:80%;
    margin-right:8px;}
.sideCol-content .text-container h6 {font-size:1rem; line-height:1.3; margin:0 0 5px;}	
.your-story .choose-cover h4 {font-size:2.2rem;}

.os-starbg:before {display:none;}
.our-story .lightPurple-bg {padding:4rem 0 3rem;}
.our-story .began-with .column-left {
    width:100%;
    max-width:62%;
    margin:0 auto;}
.our-story .began-with .content-left .ytext:nth-child(2) {padding-left:0;}	
.our-story .began-with .content-left .ytext .img-wish {
	position:absolute;
    right:inherit;
    top:-1.5rem;
    display:inline-block;
    max-width:12rem;}
.the-story-behind {min-height:480px;}			
.our-story .darkgray-bg {padding:4rem 0;}
.container-science h2 {font-size:4rem;}
.story-of-grayden .column-left .content-left {padding-left:0;}
.container-illustrator {display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:column;
    margin: 0 auto;
    padding: 0;}
.container-illustrator .column-right {
    width:100%;
    margin:0 auto;
    padding:0;
    text-align:center;}
.container-illustrator .column-left .text-wrap-container {bottom:0; padding:5rem;}	
.container-illustrator .column-left {
    width:100%;}
.our-story .purple-bg {padding:4rem 0 4rem;}		
.team-module .team-header h2 { 
    margin:0 auto 2rem;
    text-align:center;
    font-size:2rem;}
.team-module .team-content {
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    justify-content: space-between;
    margin: 2rem auto 0;
    text-align: center;
    padding: 0;
    width: 100%;}	
footer .footer-section:before {display:none;}	
.story-of-grayden .banner-caption h3 {font-size:1rem; line-height:2rem;}
.story-of-grayden .banner-caption h3 .story {
        font-size:5rem;
        line-height:6rem;
        min-height:6rem;}
.our-story .texture-bg.texture-os {padding:5rem 0;}		

.detail-starbg:before {display:none;}
.detail-starbg.marronBG-circle {padding:3.5rem 0;}
.product-detail .cream-bg:after {display:none;}
.book-unique {gap:30px;
    max-width:100%;
    margin:0 auto;}
.product-detail .cream-bg {padding:4rem 0 2rem;}
.product-detail .birthday-book-section .birthday-block .customb-left {
        padding-left:0;
        padding-right:0;
        width:100%;
        margin-bottom:5rem;
        text-align:center;}
.product-detail .birthday-book-section .birthday-block .customb-left .left-section {
    max-width:80%;
    margin:0;
    text-align:center;}
.product-detail .birthday-block .customb-left img.birthday-img {margin:0 auto; max-width:100%;}	
.product-detail .texture-bg.texture-os {padding:4rem 0;}
.quote-section.story-quote .blockquote .qoute {background-size:40px !important; width:40px;}
.container-books .bug-icon:after {
        right:0;
        bottom:20px;
        width:120px;
        height:80px;}

.productDetail .listView .listItem {
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    margin: 0;
    padding: 0 10px;
    position: relative;
    z-index: 9;
    width:33.333%;
    max-width:100%;}
.productDetail .listItem .product-thumb:after {display:none;}	
.productDetail .listView {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: row;
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 100%;
    text-align: center;
    flex-wrap: wrap;}
.productDetail .listView:after {display:none;} 		
.productDetail .listItem .product-thumb {top:0; max-width:100%; margin:0 auto 10px;}
.productDetail .listItem .product-thumb .description h4 {
    font-weight:700;
    margin:15px auto;
    text-align:center;
    font-size:15px;
    letter-spacing:0.5px;
    text-transform:uppercase;
    font-family:var(--primaryFont);
    color:var(--PrimaryClr);
    position:relative;
    top:0;}
.banner-detail .banner-section {width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:row;
    margin:15px auto 0;
    padding:0 8px;}
#product-info .banner-container.banner-detail {max-width:100%; padding:0 15px !important;}
#product-info .banner-section .gallery-container {flex-direction:column;}
.banner-section .gallery-container .gallery-thumbs {height:auto;
    width:100%;
    margin-left:0 !important;
    padding-left:0;
    order:2;}
.banner-section .gallery-container .gallery-main {height:auto; width:100%; margin-bottom:10px;}	
.banner-section .gallery-container .gallery-thumbs {width:100%;}
#product-info .banner-detail .detail-bleft {width:100%;}
#product-info .banner-detail .detail-bright {width:100%;}
.banner-section .gallery-container .gallery-thumbs .swiper-slide {
	height:200px !important;
    width:110px;
    margin-bottom:20px;}
#product-info .banner-detail .swiper-button-prev, #product-info .banner-detail .swiper-rtl .swiper-button-prev {left:15px; top:40%;}	
#product-info .banner-detail .swiper-button-next, #product-info .banner-detail .swiper-rtl .swiper-button-next {left:inherit; right:15px; top:40%;}	
#product-info .banner-container .right-content {background:url('../images/off-texture.png') repeat left top;}
#product-info .banner-detail .banner-section .image img {width:100%;}	
.book-faq .right {padding-left:1rem;}

.login-container .login-section {width:100%; flex:none;}		
.login-container .login-section:first-child {order:-1; margin-bottom:30px !important;}

.privacy-main .ladybug-bg:before {right:0;}
.privacy-starbg {
    position:relative;
    padding:3rem 0;}
.privacy-main .green-content .column-full {max-width:100%;}
.privacy-main section.texture-bg.texture-os {padding:3rem 0;}

.quote-section.privacy-quote .blockquote {
    max-width:100%;
    padding:0 2rem;
	font-size: 1.7rem;
    line-height: 1.4;}
.quote-section.privacy-quote .blockquote .qoute.left {
    left:2px;
    top:0;
    background-size:42px !important;
    width:42px;
    height:42px;}
.quote-section.privacy-quote .blockquote .qoute.right {
    bottom: -6px;
    margin-left: 10px;
    right: inherit;
    background-size: 42px !important;
    width: 42px;
    height: 42px;}	
.faq-main:before {display:none;}	
.faq-main section.whiteBG-circle {padding:3rem 0;}
.faq-middle .container .row > .col-md-6.col-xs-12 {width:100%;}
.ques-ans {padding-right:0; margin-bottom:1rem; font-size:1rem;}
.faq-middle .ques-ans h5.orangeTxt {font-size:1.2rem;}
.faq-middle .ques-ans h5 {font-size:1.2rem;}
.faq-main .texture-bg.texture-os {padding:4rem 0;}
.more-help .caption h4 {font-size:2rem; margin:0 0 5px;}
.faq-main .quote-section.privacy-quote .blockquote .qoute.left {left:-18px;}
.faq-main .quote-section.privacy-quote .blockquote .qoute.right {bottom:-15px;}
	

}



@media all and (max-width:767px) {

.testimonial-panel { padding:0 15px;}
.testimonial-module .testimonial-item .testimonial-text {font-size:0.9rem; line-height:1.6;}
.steps-container .step .blob-shape {padding: 25px 20px; min-height: 180px;}
.footer-col ul li a, .footer-col .country-line, footer .copyright {font-weight: 400;}
.personalized-storybook h2 {
        margin-top: 0;
        font-size: 1.7rem;
        line-height: 1.3;}
.birthday-block h3 .birthday-text {font-size: 4rem;}		
.birthday-block .right-section p {
        font-size: 0.95rem;
        line-height: 1.8;
        font-weight: 600;}

.footer-col .country-line {
        border-top: 1px solid #293757;
        padding-top: 1.5rem;
        font-weight: 600 !important;
        margin-top: 3rem;}
footer .footer-col {margin-bottom:20px;}	
footer .copyright {font-size:0.8rem !important; color:#989898; padding:1.5rem 0 0rem; line-height:1.4;}	
.testimonial-content .owl-theme .owl-nav.disabled+.owl-dots {margin-bottom:0;}
.testimonial-module .testimonial-item .testimonial-name {font-size:1rem;}
.testimonial-module .testimonial-item .testimonial-name:before {background-size:14px;}
.testimonial-module .testimonial-header h2 {
        font-size:1.8rem;
        text-align:center;
        margin:0 auto 30px;}
.steps-container .step .blob-shape .step-index {font-size:1.5rem;}		
.maroon-bg {padding:4rem 0 3rem;}
.birthday-book-section .birthday-block .customb-right:before {left:10px; top:-150px; height:200px; width:100%;}
footer .footer-section:before {background: url('../images/footer-mobile-star.png') no-repeat right bottom;
    padding: 0;
    margin: 0;
    content: '';
	width: 70px;
	display: inline-block;
	position: absolute;
	right: 0;
	bottom: 60px;
	height: 497px;
	z-index: 4;
	background-size: 100%;
	top: inherit;}		
.quote-section .blockquote {
        font-size:1.5rem;
        max-width:86%;
        line-height:1.4;}	
.quote-section .quote-auther {font-size:0.8rem;}
.quote-section .blockquote .qoute.left {
		left:-25px;
        background-size:30px !important;
        top:-10px;
        height:30px;
        width:30px;}		
.quote-section .blockquote .qoute.right {
	background-size:30px !important;
	    width: 30px;
        bottom: -10px;
        margin-left: 10px;
        height:30px;}		
.featured-products .product-thumb .description h4 {
        margin:10px auto 0;
        font-size: 1rem;
        color: #E79E3D;}		
.featured-products .product-thumb .description h4 a {
    color: #E79E3D;
    text-decoration:none;}		
.featured-products .owl-carousel .owl-nav button {width:40px; height:40px;}	
.featured-products .owl-carousel .owl-nav {position: absolute;
    top: inherit;
    left: 50%;
    transform: translate(-50%, -10%);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin: 0;
    padding: 0;}
.featured-products .owl-carousel .owl-nav button.owl-prev {left:-10px;}		
.featured-products .owl-carousel .owl-nav button.owl-next {right:-10px;}
.featured-products .owl-carousel .owl-nav button i.fa {font-size:18px;}		
section.greenDark-bg.star-right:before {display:none;}
.began-with .column-left .content-left {font-size:30px; margin-bottom:15px;}
.began-with .content-left .ytext .img-wish {top: -20px;
        display: inline-block;
        max-width: 150px;}
.began-with .content-left .ytext {padding-bottom:10px;}	
.banner-container .banner-caption .description p br {
    display: none;}	
.banner-container .banner-caption .description p {
        font-size: 1rem;
        line-height: 1.7;}	
.banner-container .banner-caption .twins-button {
        font-size: 0.8rem;
        line-height: 1rem;
        margin: 1.5rem auto 1rem;}		
.banner-container .star-bg-left:before {display:none;}		
.banner-container .banner-caption {padding:30px 20px; margin:0;}
.banner-container .banner-caption h3 span.story {font-size:6rem;}
.banner-container .banner-caption h3 span.posr {right:-6.5rem;}
.banner-container .banner-caption h3 span.posd {line-height:1;}
.banner-container .banner-caption .form-group {margin-top:25px;}
.banner-container .right-content:before {
    content: '';
    position: absolute;
    left: 0;
    background: url('../images/mobile-banner-corner.png') repeat-x left top;
    display: inline-block;
	height: 17px;
	width: 100%;
	top: -15px;
	z-index: 9999;
	bottom: 0;}
.header-container {height:auto;}	
.header-container .logo_header {width:44%;}	
.header-container #logo img {max-width:150px; shape-rendering:auto; filter:none;}
.header-container .menu_header {
        width: 12%;
        order: 3;
        padding: 0;}
.header-container .search_header {
        width: 40%;
        order: 2;
        margin: 0;
        padding: 0 15px !important;}	
		
#menu .navbar-nav > li > a {font-size: 0.8rem;}

.quote-section.ys-quote .blockquote {max-width:85%;}
section.image-right .sideCol-content .column-left {order:2;}
.your-story .bug-icon:after {bottom:-4.5rem;}
.quote-section.ys-quote .blockquote .qoute.right {
	background-size:35px !important;
        width:35px;
        bottom:-10px;
        margin-left:0;
        height:30px;
        right:-30px;}
.quote-section.ys-quote .blockquote .qoute.left {left:-30px; top:-10px;}
.quote-section.ys-quote .quote-auther img {
    margin-top:4px;
    margin-right:10px;
    max-width:14px;}
.quote-section.ys-quote .quote-auther {max-width:90%;}
.your-story section.bluesky-bg {padding:3rem 0;}
.your-story section.ys-starbg:before {display:none;}
.sideCol-content {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    margin: 0 auto;
    width: 100%;}
.sideCol-content .column-left {
    width: 100%;
    height: 100%;
    display: block;
    margin: 0 auto;
    padding: 0;}
.sideCol-content .column-right {
    width: 100%;
    height: 100%;}
.sideCol-content .text-container {padding:2rem 2rem 3rem; align-items:flex-start; width:100%;}
.sideCol-content .text-container .content-inner {gap:5px;}
.sideCol-content .text-container h6 {font-size: 18px; margin: 0 0 15px;}
.sideCol-content .text-container h4 br {display:none;}
.sideCol-content .text-container h4 {
        font-size: 1.5rem;
        margin: 0 0 0.5rem;}
.sideCol-content .text-container ul {gap:15px;}
.sideCol-content .text-container ul li {
        font-size:14px;
        line-height: 1.3;
        display: inline-flex;}
.your-story .quote-section.home-quote .blockquote .qoute.left {left:-40px;}		
.your-story .quote-section.home-quote .blockquote .qoute.right {bottom:-10px;  margin-left: 0; right: 0;}
.your-story .lightPurple-bg {padding: 2.5rem 0 4rem;}
.your-story .choose-cover h4 {
        font-size:30px;
        padding:0 15px;
        display:block;
        line-height: 1.4;
        margin-bottom: 0;}
.your-story .choose-cover button.btn-primary {border-radius: 15px;
    height: 3.7rem;
    line-height: 3.7rem;
    padding: 0 1rem;
    margin: 0 auto;
    color: var(--whiteText);
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    transition:all linear .3s;
    width:90%;}
.your-story .quote-section.home-quote .blockquote {max-width:82%;}

.our-story .began-with .column-left {
		width:100%;
        max-width:100%;
        margin:0 auto;}
.our-story .began-with .column-left .content-left {margin-bottom:0;}	
.our-story .began-with .content-left .ytext .img-wish {
		position:absolute;	
        right:inherit;
        top:-15px;
        display:inline-block;
        max-width:130px;}	
.the-story-behind {min-height:250px;}		

.our-story .began-with .column-left .content-left {margin:0 auto; text-align:left; padding:0 10px; font-size:26px;}
.our-story .darkgray-bg {padding:1rem 0;}
.container-science h2 {font-size:2rem;}

.container-story-behind .story-content h2 {font-size: 20px;
    line-height: 1.4;
    font-weight: 400;
    text-align: center;
    margin: 0 0 1rem;
    padding: 0;
    letter-spacing: normal;}
.story-content h2 .posr {
    position:absolute;
    right:-0.8rem;
    top:0.8rem;
    display:inline-block;}	
.container-story-behind .story-content img {max-width:110px;}
.story-content h2 .posr {
    position:absolute;
    right:-1rem;
    top:0;
    display:inline-block;
    line-height:1;}
.story-content h2 .story {
    font-size:60px;
    line-height:96px;
    min-height:96px;}	
.story-content h2 .posd {
    position:relative;
    top:0;
    margin-top:10px;
    display:block;
    left:0;
    line-height:1;}	
.our-story .lightPurple-bg {padding:2rem 0;}
.founder-content {font-size:14px;
    line-height:2;
    padding:1rem;}	
.founder-content p {font-size:14px;}	
.founder-content h4 {color: #E9CF81;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.6;
    margin: 2rem auto;
    text-align: center;
    max-width: 100%;}
.story-of-grayden {flex-direction:column;}	
.story-of-grayden .column-left {
    width:100%;
    padding:0;}
.story-of-grayden .column-right {width:100%; position:relative; order:-1;}	
.story-of-grayden .banner-caption {padding:3.5rem 0;}
.story-of-grayden .column-right img {
    visibility:hidden;
    opacity:0; 
	display:none;}
.story-of-grayden .banner-caption h3 {font-size:20px;}	
.story-of-grayden .column-right:before {content:""; background:url('../images/story-of-grayden-child.png') repeat left top; margin:0 auto; padding:0; display:block; height:366px; width:100%;}	
.quote-section.story-quote .blockquote {max-width:84%;}
.quote-section.story-quote .blockquote .qoute.left {left:-30px; background-size:28px !important;}
.quote-section.story-quote .blockquote .qoute.right {
		background-size:28px !important;
        width:28px;
        bottom:-10px;
        margin-left:0;
        height:30px;
        right:0;}
.container-illustrator .column-right .content-section {max-width:100%; padding-bottom:1rem;}		
.container-illustrator .column-left .text-wrap-container {
        bottom:0;
        padding:2rem;}		
.container-illustrator .content-section .sub-title {font-size:1.8rem;
    text-transform:uppercase;
    line-height:1;
    padding:0;
    margin:1rem 0 2rem;}
.container-illustrator .content-section p {margin:0 0 25px; font-weight:600;}	
.our-story + .purple-bg {padding:3rem 0;}	
.team-module .team-header h2 {
        margin:0 auto 2rem;
        font-size:28px; 
		line-height:1.4;}		
.team-module .team-content {gap:15px;}		
.team-content .team-item .team-image {
        width:150px;
        height:150px;}	
.team-content .team-item .team-name {    
	padding:1rem 0 3rem;
    margin:0 auto;
    font-size:14px;}	
footer:before {top:-6px !important;
    height:14px;
    z-index:4;
    background-size:30px; 
	background-repeat:repeat-x;}			

.detail-starbg.marronBG-circle {padding:2rem 0;}
.book-unique {gap:15px;
        max-width:100%;
        margin:0 auto;
        flex-direction:column;
		padding:0 10px;}	
.book-unique .column-left {width:100%;}		
.book-unique .column-right {
    width:100%;
    margin:0 auto;}
.book-unique .column-right .wish-wrap {
    max-width: 50%;
    margin: 0 auto 20px;
    text-align: center;}	
.productDetail h2 {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
    padding: 0;
    margin: 0 auto 25px;
    text-align: center;
    display: block;}

.productDetail .listView .listItem {
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    margin: 0;
    padding: 0 10px;
    position: relative;
    z-index: 9;
    width:50%;
    max-width:100%;}
.productDetail .listItem .product-thumb:after {display:none;}	
.productDetail .listView {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: row;
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 100%;
    text-align: center;
    flex-wrap: wrap;}
.productDetail .listView:after {display:none;} 		
.productDetail .listItem .product-thumb {top:0; max-width:100%; margin:0 auto 10px;}
.productDetail .listItem .product-thumb .description h4 {
    font-weight:700;
    margin:15px auto;
    text-align:center;
    font-size:15px;
    letter-spacing:0.5px;
    text-transform:uppercase;
    font-family:var(--primaryFont);
    color:var(--PrimaryClr);
    position:relative;
    top:0;}
.product-detail .quote-section.story-quote .blockquote {max-width:100%; padding:0 40px;}
.product-detail .quote-section.story-quote .blockquote .qoute.left {left:0; background-size:36px !important;}
.product-detail .quote-section.story-quote .blockquote .qoute.right {background-size:36px !important;
        width:36px;
        bottom:-5px;
        margin-left:0;
        height:30px;
        right:0;}
.product-detail .quote-section .quote-auther {
        font-size:0.8rem;
        margin-top:20px;}
.product-detail .quote-auther img {
    max-width:14px;
    margin-right:8px;}		
.product-detail .birthday-book-section .birthday-block .customb-right:before {
        left: 20px;
        top: -158px;
        height: 200px;
        width:100%;}	
.container-books .bug-icon:after {
        right:0;
        bottom:15px;
        width:70px;
        height:50px;}		
.product-detail .bluefade-bg {
    padding-bottom:0;
    padding-top:20px;}		
.footer-col #footer-logo a img {width:220px; max-width:100%; shape-rendering:auto; filter:none;}
.container-books .four-books .books-img {
    max-width:135%;
    margin-left:-70px !important;}
.product-detail .marronBG-circle::after {display:none;}	
.product-detail .cream-bg {padding:3rem 0 2rem;}

.banner-detail .banner-section {width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:row;
    margin:15px auto 0;
    padding:0 8px;}
#product-info .banner-container.banner-detail {max-width:100%; padding:0 15px !important;}
#product-info .banner-section .gallery-container {flex-direction:column;}
.banner-section .gallery-container .gallery-thumbs {height:auto;
    width:100%;
    margin-left:0 !important;
    padding-left:0;
    order:2;}
.banner-section .gallery-container .gallery-main {height:auto; width:100%; margin-bottom:10px;}	
.banner-section .gallery-container .gallery-thumbs {width:100%;}
#product-info .banner-detail .detail-bleft {width:100%;}
#product-info .banner-detail .detail-bright {width:100%;}
.banner-section .gallery-container .gallery-thumbs .swiper-slide {height:110px !important;
    width:110px;
    margin-bottom:20px;}
#product-info .banner-detail .swiper-button-prev, #product-info .banner-detail .swiper-rtl .swiper-button-prev {left:15px; top:40%;}	
#product-info .banner-detail .swiper-button-next, #product-info .banner-detail .swiper-rtl .swiper-button-next {left:inherit; right:15px; top:40%;}	
#product-info .banner-container .right-content {background:url('../images/off-texture.png') repeat left top;}
#product-info .banner-container .banner-caption {
        padding:15px;
        margin:0;}
.banner-container .banner-caption .description.detail h5 {font-size:1rem;
    line-height:1.6;
    margin:20px 0;}		
#product-info .banner-container .banner-caption .description.detail {max-width:100%; margin-bottom:2rem; text-align:center;}	
#product-info .banner-detail .banner-caption .description.detail p {
    font-weight: 500;
    margin-bottom: 10px;
    line-height: 26px;
    font-size:16px;}
#product-info .bluesky-bg {padding:3rem 0;}	
#product-info .book-faq .row {margin:0 auto;}
#product-info .book-faq .col-md-6 {
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;}
#product-info .book-faq p {text-align:center;}	
.book-faq .right {padding: 0;
    margin: 30px auto 0;
    width: 100%;
    display: block;}
.pd-quote .quote-section .blockquote {
    position: relative;
    font-family: var(--secondFont);
    font-size: 24px;
    font-weight: 300;
    color: var(--marronText);
    line-height: 1.6;
    letter-spacing: normal;
    margin: 0 auto;
    padding: 0;
    max-width: 85%;}	
.pd-quote .quote-section .blockquote .qoute.left {left:-30px;}	
.pd-quote .quote-section .blockquote .qoute.right {
        background-size: 30px !important;
        width: 30px;
        bottom: -5px;
        margin-left: 0;
        height: 30px;
        right: -30px;}
.pd-quote .quote-section .quote-auther {
		display:flex;
        align-items: flex-start;
        justify-content: center;
        width: 95%;
        text-align: left;
        line-height: 1.4;
        text-transform: none;
        margin-top: 2rem;
        font-size: 15px;
        font-weight: 600;
        position: relative;}		
.pd-quote .quote-section .quote-auther img {
    max-width:14px;
    margin-right:10px;
    margin-top:3px;}

.login-container .login-box {padding:20px 15px; font-size:13px;}
.login-box h2 {font-size:18px; margin:0 0 10px;}			
.login-box .btn-primary {height:44px;
    line-height:42px;
    min-width:110px;
    font-size:14px;
    font-weight:500; 
	padding:0 20px;}
	
#account-register .login-box h1 {font-size:18px; margin-bottom:1rem;}
#account-register .login-box fieldset legend {margin-bottom:1rem; padding:0.3rem 0; font-size:14px; font-weight:600;}
form#form-register .col-form-label {
    text-align:left;
    font-weight:600;
    line-height:1.4;
    font-size:0.8rem;
    padding:0.25rem 0.5rem;
    max-width:100%;
    width:100%;}
form#form-register .input-field {
    width:100%;
    padding:0 0.5rem;}	
form#form-register .action-button {margin:0;}	
form#form-register .action-button .form-switch {
    padding-right: 0;
    padding-left: 0;
    min-height: inherit;
    line-height: inherit;
    margin-right: 0;
    text-align: left;
    width: 100%;
    display: flex;
    flex-direction:column;
    gap:5px;}
form#form-register .action-button .form-switch label {
    font-size:0.85rem;
    font-weight:normal;
    display:block;}	
form#form-register .action-button .form-switch .form-check-input {
    margin-right:0;
    margin-left:0;
    margin-top:0;
    margin-bottom:10px;}	
#account-forgotten .login-box h1 {font-size:18px; margin-bottom:1rem;}	
#account-forgotten .login-box fieldset legend {margin-bottom:1rem; padding:0.3rem 0; font-size:14px; font-weight:600;}
form#form-forgotten a.btn {height: 44px;
        line-height: 42px;
        min-width: 110px;
        font-size: 14px;
        font-weight: 500;
        padding: 0 20px;}
form#form-forgotten .col-form-label {
    text-align:left;
    font-weight:600;
    line-height:1.4;
    font-size:0.8rem;
    padding:0.25rem 0.5rem;
    max-width:100%;
    width:100%;}
form#form-forgotten .input-field {
    width:100%;
    padding:0 0.5rem;}			
.modal-body .cms-inner {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;}
.modal-body .cms-inner .cms-para {
    font-size: 14px;
    margin-bottom: 15px;}	
.modal-body .cms-inner h3 {
    margin-top: 20px;
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 15px;}	
.modal-body .cms-inner h3 strong {font-weight:600;}	
.modal-body .cms-inner p {font-size:14px;
    line-height:1.4;
    margin-bottom:1.5rem;}
.modal-body .cms-inner ul {
    list-style:disc;
    margin-bottom:20px;
    padding-left:15px;}	
.modal-body .cms-inner ul p {margin-bottom:10px;}

.account-box .account-col {width:100%; padding:1rem;}	

.login-container aside#column-right {display: block !important;}
#content + aside#column-right {display: block !important; width:100%;}
#account-account .login-container .login-inner {
    flex:none;
    width:100%;
    margin:0 0 30px;}
.login-container aside#column-right {
    display:block !important;
    width:100%;
    padding-top:30px;
    border-top:1px solid #e5e5e5;}	
.account-box .account-col h1, .account-box .account-col h2 {font-size:17px;}	
.account-box .account-col ul {width:100%; font-size:13px;}

.account-inner {padding:15px 15px 20px; font-size:13px;}
.account-inner h1 {font-size:18px; margin:0 0 15px;}
.account-inner legend {
    border-bottom:1px solid #d1e6ef;
    margin-bottom:15px;
    font-size:15px;
    font-weight:600;}
.account-inner #address .table a.btn-primary {margin-bottom:10px;} 	

.privacy-main:before {display:none;}
.privacy-main .green-content p {font-size:0.85rem; line-height:1.6;}
.privacy-starbg {padding:2rem 0;}
.privacy-main section.whiteBG-circle {padding:2rem 0;}
.privacy-middle .pp-left {max-width:100%;}
.privacy-middle .pp-left .pp-header {margin-bottom:2rem;}
.privacy-middle .pp-left h2 {font-size:30px; margin-bottom:1rem;}
.privacy-middle .pp-left p {
        font-size:0.85rem;
        font-weight:500;
		margin-bottom:1rem;}
.privacy-middle .pp-left h3 {font-size:1.2rem; font-weight:600;}
.privacy-main .ladybug-bg:before {
        right:0;
        width:130px;
        height:100%;
        z-index:-1;}		
.privacy-middle .pp-right {display:none;}
.privacy-main section.texture-bg.texture-os {padding:2rem 0;}		
.quote-section.privacy-quote .blockquote {
        max-width: 100%;
        padding: 0 2rem;
        font-size: 1rem;
        line-height: 1.4;
        font-weight: 400;}
.quote-section.privacy-quote .blockquote .qoute.left {
        left: 0;
        top: 0;
        background-size: 25px !important;
        width: 25px;
        height: 25px;}
.quote-section.privacy-quote .blockquote .qoute.right {
        bottom: -8px;
        margin-left: 10px;
        right: inherit;
        background-size: 25px !important;
        width: 25px;
        height: 25px;}	
.quote-section.privacy-quote .quote-auther {
    width: 90%;
    line-height: 1.5;
    max-width: 100%;
    align-items: flex-start;
    font-size:0.70rem;
    font-weight:600;}			
.quote-section.privacy-quote .quote-auther img {
    max-width: 13px;
    margin-right: 5px;
    margin-top:4px;}

.privacy-starbg {padding:2rem 0 3rem;}
.faq-main .unique-crafted {gap:10px;}
.faq-main .unique-crafted h6 {font-size:12px;}		
.faq-main .unique-crafted h6 span {font-size:13px;}
.faq-middle {max-width:96%;}
.faq-middle h2 {
    font-size:32px;
    margin-bottom:10px;}
.ques-ans {font-size:12px; font-weight:600;}	
.faq-middle .ques-ans h5.orangeTxt {
        font-size:14px;
        margin-bottom:5px;
        line-height:1.4;}
.faq-middle .ques-ans h5 {font-size:14px; line-height:1.2;}
.faq-middle .ques-ans .frdots {
    letter-spacing:4px;
    font-weight:800;
    font-size:1.1rem;
    padding:0 4px;
    line-height:1.2;}
.faq-main .texture-bg.texture-os {padding: 3rem 0;}	
.faq-main .quote-section.privacy-quote .blockquote {padding: 0 28px; font-size: 1rem;}
.faq-main .quote-section.privacy-quote .blockquote .qoute.left {left:0;}
.faq-main .quote-section.privacy-quote .blockquote .qoute.right {bottom:-10px;}
.more-help .banner-img .caption {position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0 auto;
    text-align: left;
    padding: 0 15px;
    width: 100%;}
.more-help .caption h4 {
        font-size: 18px;
        margin: 0 0 5px;
        font-weight: 500;}		
.more-help .caption .contact {gap:5px;}		
.caption .contact .btext {font-size:12px;}
.caption .contact .otext {font-size:14px;}
.caption .contact a {font-size:12px;}

.gallery-container .swiper-thumbs>.swiper-wrapper {flex-direction:row;}
.book-faq .left {padding-left:0; padding-right:0;}

}


@media all and (max-width:375px) {

.product-detail .birthday-book-section .birthday-block .customb-right:before {left:30px; top:-145px;}

}

