
.th_banner {text-align: center;}
.th_banner picture img {max-width: 1920px; margin-inline: auto;}


.categories {padding-block: 54px 68px;}
.categories .container {text-align: center;}
.categories .head {margin-bottom: 48px;}
.categories .head h1 ,.categories .head h2 {max-width: 58%; margin-inline: auto;font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px; }
.categories .head h1 span,.categories .head h2 span{color: var(--clr-primary);}
.categories .head p {max-width: 68%; margin-inline: auto;font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.categories .products {display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px 20px; margin-bottom: 56px;}
.categories .products img {width:100%; height:auto}
.categories .box {padding: 24px; background-color:var(--clr-light-50); border-radius: 23px;}
.categories .box strong {font-size: var(--fs-400); font-weight: var(--fw-semi-bold); margin-bottom: 24px; text-align: start;}
.categories .box:hover {background-color: #fcf6dd;}
.categories .custom__btn-primary{margin-inline:auto;}

.quote {padding-bottom: 70px;}
.quote .container > .title {text-align: center; margin-bottom: 48px;}
.quote .title :first-child {font-size: var(--fs-xl); color: var(--clr-primary); margin-bottom: 12px;}
.quote .title :first-child span {color: var(--clr-primary);}
.quote .title p {font-size: var(--fs-400); color: var(--clr-light-300);}
.quote .title {font-size: var(--fs-400); color: var(--clr-light-300);}
.quote .content {display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px;}
.quote .info li { background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/info-icon-2.png);background-repeat: no-repeat; background-position: left top;
padding-left: 80px;position: relative;margin-bottom: 40px; font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.quote .info li:first-child { https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/info-icon-1.png);}
.quote .info li:nth-last-of-type(1) { background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/more-perks.webp);}
.quote .info li img {width: 50px;}
.quote .info li strong{color: black; ;font-size: var(--fs-600); font-weight: var(--fw-semi-bold); display: block; margin-bottom: 6px; }
/* .quote .info li  {padding-left: 42px;} */
.quote .info li  p { font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.quote .info .custom__btn-primary {margin-left: auto;}


.offer {padding-bottom: 70px;}
.offer .columns {display: grid; grid-template-columns: repeat(2, 1fr); gap: 44px;}
.offer .images {display: flex; align-items: start; gap: 20px;}
.offer .images img {width: 285px;}
.offer .images > img {margin-top: 32px;}
.offer .images div img:first-child {margin-bottom: 20px;}
.offer .content {display: flex; flex-direction: column; justify-content: center;}
.offer .content label{font-size: var(--fs-300); font-weight: var(--fw-semi-bold); line-height: 160%; color: #080808;}
.offer .content h2 span{color: var(--clr-primary);}
.offer .content h2{font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.offer .content p {font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300); margin-bottom: 15px;}
.offer .content li{max-width: 460px;font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.offer .content .custom__btn-primary {margin-top: 20px;}


.printing {padding-bottom: 70px;}
.printing .columns:first-child {display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; margin-bottom: 36px;}
.printing .content label{font-size: var(--fs-300); font-weight: var(--fw-semi-bold); line-height: 160%; color: #080808;}
.printing .content h2 span{color: var(--clr-secondary);}
.printing .content h2,.printing .content h2,.printing .content h4 {font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.printing .content p{font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.custom__btn-primary {width: 139px; height: 46px; background-color: var(--clr-primary); color: #fff; font-size: var(--fs-500); font-weight: var(--fw-semi-bold); border-radius: 5px;}
/*     .printing .images:nth-child(1) {display: none;} */
.printing .images img {max-width: 523px; margin-left: auto;}
.printing .columns:nth-child(2) {display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; text-align: center;}
.printing .reason {padding: 40px 12px;background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/Group2504.webp);
background-repeat: no-repeat;
background-position: top;}
.printing .reason:nth-child(2){background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/Group2505.webp);}
.printing .reason:nth-child(3){background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/precision.webp);}
.printing .reason:last-child{background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/reliable.webp);}
.printing .reason img {margin-inline: auto; position: relative;}
.printing .reason img::before {position: absolute; top: 0; left: 0; width: 71px; height: 71px; background-color: #FAFCFF; content: '';}
.printing .reason label {padding-top:10px;margin-block: 28px 12px; font-size: var(--fs-500); font-weight: var(--fw-semi-bold);display:block; color:#080808;}
.printing .reason p {max-width: 260px; margin-inline: auto;font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.custom__btn-primary {width: 139px; height: 46px; background-color: var(--clr-primary); color: #fff; font-size: var(--fs-500); font-weight: var(--fw-semi-bold); border-radius: 5px;}


.shipping {padding-bottom: 70px;}
.shipping .columns {display: grid; grid-template-columns: 60% 1fr;}
.shipping .image img {max-width: 655px; object-fit:contain}
.shipping .content {max-width: 480px;}
.shipping .content label{font-size: var(--fs-300); font-weight: var(--fw-semi-bold); line-height: 160%; color: #080808;}
.shipping .content h2 span{color: var(--clr-primary);}
.shipping .content h2,.shipping .content h3,.shipping .content h4{font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.shipping .content p{font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.shipping .content ul {padding-left: 20px; margin-block: 36px;}
.shipping .content li {list-style: disc; font-size: var(--fs-300); font-weight: var(--fw-semi-bold); margin-bottom: 12px;}

.our-work {padding-bottom: 70px;}
.our-work .columns {display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px;}
/*     .our-work .images:nth-child(1) {display: none;} */
.our-work .content {padding-top: 30px;}
.our-work .content label{font-size: var(--fs-300); font-weight: var(--fw-semi-bold); line-height: 160%; color: #080808;}
.our-work .content h2 span{color: var(--clr-primary);}
.our-work .content h2,.our-work .content h3,.our-work .content h4{font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.our-work .content p{font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.our-work .content ul {margin-block: 36px;}
.our-work .content li {position: relative; font-size: var(--fs-300); font-weight: var(--fw-semi-bold); height: 28px; margin-bottom: 20px; padding-left: 40px; display: flex; align-items: center;}
.our-work .content li::before {position: absolute; top: 0; left: 0; width: 28px; height: 28px; background: no-repeat center/cover url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images//icons/tick-icon.png); content: '';}
.our-work .images img {max-width: 590px; margin-inline: auto;object-fit:contain}


.testimonials {padding-bottom: 70px;}
.testimonials .head {text-align: center; max-width: 750px; margin-inline: auto; margin-bottom: 24px; padding-top: 18px;}
.testimonials .head label {margin: 0; line-height: 150%; font-size: var(--fs-300); font-weight: var(--fw-semi-bold); line-height: 160%; color: #080808;;}
.testimonials .head h2,.testimonials .head h3,.testimonials .head h4,.testimonials .head h5 {font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px}
.testimonials .columns {display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 46px;}
.testimonials .review {position: relative; padding: 32px 22px 64px 28px; background-color: #FBFDFF; border-radius: 9px; box-shadow: var(--shadow-lt); margin-bottom: 30px;}
.testimonials .review > :first-child {display: block; text-align: center; margin-bottom: 12px;}
.testimonials .review::before {position: absolute; bottom: 18px; right: 18px; width: 49px; height: 36px; background: no-repeat center/cover url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/quote-icon.png); content: '';}
.testimonials .review p {color: var(--clr-light-500); height: 155px;overflow-y: auto; padding-right: 18px; text-align: center; align-content: center;}
.testimonials .client-name {margin-left: 28px;}
.testimonials .client-name strong {position: relative; display: block; font-size: var(--fs-600); font-weight: var(--fw-semi-bold); margin-bottom: 12px; padding-left: 20px;}
.testimonials .client-name strong::before {position: absolute; top: 10px; left: 0; width: 8px; height: 8px; background-color: #F5CC00; border-radius: 50%; content: '';}
.testimonials .client-name ul {display: inline-flex; align-items: center; padding-left: 20px;}
.testimonials .client-name li {padding-right: 3px;}
.testimonials .client-name li svg {fill: #F5CC00; width: 12px; height: 12px;}
.testimonials .custom__btn-primary-lt {margin-inline: auto;}
.testimonials .review p {height:169px }


.faq {padding-bottom: 70px;}
.faq .head {text-align: center; margin-bottom: 48px;}
.faq .head h2{font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.faq .head h2 span{color: var(--clr-primary);}
.faq .head p{font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.faq .columns {display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px;}
.faq .image:nth-child(1) {display: none;}
.faq .image:nth-child(1) img {height: auto; margin-inline: auto;}
.faq .accordions {max-height: 400px;overflow-y: auto; padding-right: 18px;}
.faq .question label {position: relative; padding: 0 0 28px 36px; width: 100%; display: block; cursor: pointer;font-size: var(--fs-400); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary);}
.faq .question label::before {position: absolute; top: 0; left: 0; width: 23px; height: 23px; background: no-repeat center/cover url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/faq-icon-1.png); content: '';}
.faq .question label::after {position: absolute; bottom: 0; left: 0; right: 0; width: 100%; height: 18px; background: no-repeat center/cover url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images//icons/faq-divider.png); content: '';}
.faq .question input[type="radio"] {appearance: none;}
.faq .question .answer p {visibility: hidden; height: 0; overflow: hidden;}
.faq .question input[type="radio"]:where(:not(:checked),:checked) ~ .answer {padding: 12px 34px 0 34px;}
.faq .question input[type="radio"]:where(:not(:checked),:checked) ~ .answer p {visibility: visible; height: fit-content; overflow: visible; color: var(--clr-light-300);}
.faq .image:nth-child(3) img {max-width: 415px; margin-inline: auto;}


@media only screen and (max-width: 1400px) {
	.banner {height: 500px;}
}
@media only screen and (max-width: 1200px) {
	.banner {height: 480px;}
	.categories, .quote, .offer, .printing, .shipping, .our-work, .information,.testimonials, .faq{height:auto}
	.offer .images img {width: 240px;}
	.printing .reason h4 {height: 48px;}
	.shipping .columns {grid-template-columns: 55% 1fr; gap: 30px;}
	.our-work .content {padding: 0;}
	.faq .image img {max-width: 350px}
}
@media only screen and (max-width: 991px) {
	.banner{height:400px}
	.categories .head h2 {max-width: 65%;}
	.categories .products {grid-template-columns: repeat(3, 1fr);} 
	.quote .content {grid-template-columns: 1fr;}
	.quote .info ul {text-align: start;}
	.quote .quote-form {margin-inline: auto; max-width: 535px;}
	.offer .columns {grid-template-columns: 1fr;}
	.offer .images {justify-content: center;}
	.offer .images img {height: auto;}
	.printing .columns:first-child {grid-template-columns: 1fr;}
	.printing .images:nth-child(1) {display: block;}
	.printing .images img {height: auto; margin-inline: auto;}
	.printing .columns:nth-child(2) {grid-template-columns: repeat(2, 1fr);}
	.printing .reason h4 {height: auto;}
	.shipping .columns {grid-template-columns: 1fr;}
	.shipping .image img {height: auto; margin-inline: auto;}
	.our-work .columns {grid-template-columns: 1fr;}
	/*     .our-work .images:nth-child(1) {display: block;} */
	.our-work .images:nth-child(3) {display: none;}
	.our-work .content h2 {max-width: 100%;}
	.testimonials .columns {grid-template-columns: repeat(2, 1fr);}
	.faq .columns {grid-template-columns: 55% 1fr;}
}  

@media only screen and (max-width: 767px) {
	.banner {height: 310px}
	.custom__h3 {font-size:24px}
	.categories {padding-block: 36px 48px;}
	.categories .head h2 {max-width: 100%;}
	.categories .head p {max-width: 100%;}
	.categories .products {grid-template-columns: repeat(2, 1fr);} 
	.categories .head h1, .categories .head h2 {max-width: 90%;}
	.printing {--fs-500: 16px;}
	.printing .reason {--fs-400: 15px;}
	.information .columns {grid-template-columns: 1fr;}
	.information .content {max-width: 100%;}
	.information .content:nth-child(1) > img {display: none;}
	.information .content p {max-height: 130px;}
	.testimonials .columns {grid-template-columns: 1fr;}
	.testimonials .review {padding-bottom: 52px;}
	.testimonials .review p {max-height: 78px;}
	.testimonials .review::before {width: 36px; height: 26px;}
	.faq .columns {grid-template-columns: 1fr;}
	.faq .image:nth-child(1) {display: block;}
	.faq .image:nth-child(3) {display: none;}
	.faq .accordions {max-width: 500px;}
}

@media only screen and (max-width: 575px) {
	.banner {height: 230px}
	.categories .head {margin-bottom: 28px;}
	.categories .products {grid-template-columns: repeat(1, 1fr); gap: 20px;} 
	.categories .box h3 {text-align: center;}
	.quote .info li div {padding-left: 24px;}
	.quote form {padding-inline: 32px;}
	.offer .images img {width: 200px;}
	.printing .reason h4 {height: 44px;}
	.information .content p {padding-right: 15px; max-height: 102px;}
	.testimonials .review p {max-height: 100px;}
}

@media only screen and (max-width: 475px) {
	.banner  {height: 188px;}
	.categories{min-height:3500px;}
	.products a{min-height:370px}
	.categories .head h2 {margin-bottom: 12px; font-size: var(--fs-600);}
	.categories .head p{height:100px}
	.quote .info h2 { font-size: var(--fs-600);}
	.quote .info li h3, .offer .content h3 { font-size: var(--fs-600);}
	.quote .info li {padding-left: 70px;}
	.printing .content h3 , .shipping .content h3,.our-work .content h3 { font-size: var(--fs-600);}
	.information .content h4 { font-size: var(--fs-400);}
	.testimonials .head h3, .faq .head h2 { font-size: var(--fs-600);}
	.testimonials .client-name strong { font-size: var(--fs-400);}
	.custom__btn-primary{ font-size: var(--fs-400);}
	.quote {--fs-300: 12px;}
	.quote .info li {margin-bottom: 32px;}
	.quote .info li img {width: 40px;}
	.quote .info li div {padding-left: 18px;}
	.quote .info li div h3 {margin-bottom: 15px;}
	.offer .images {gap: 12px;}
	.offer .images img {width: 150px;}
	.printing .columns:nth-child(2) {grid-template-columns: 1fr;}
	.printing .reason h4 {height: auto;}
	.testimonials .review p {padding-right: 10px;}
}

@media only screen and (max-width: 400px) {
	.categories .head p{height:120px}
	.products a {min-height:334px}
	.products img {height:213px}
}



