contact
Page: Contact Us Page (Build Trust & Accessibility)


Snippet Code
<style>
.section-responsive-padding {
padding-top: 30px;
padding-bottom: 30px;
}
.section-image-overlay.ambient {
animation: animateAmbientOverlay 9s ease-in-out infinite;
}
.section-image-overlay {
position: absolute;
object-fit: contain;
height: auto;
max-width: 100%;
max-height: 100%;
}
.section-image-overlay.overlay-2.ambient {
animation: animateAmbientOverlay 10s ease-in-out infinite;
}
.isolate {
position: relative;
z-index: 0;
}
.page-width {
max-width: 1600px;
margin: 0 auto;
}
.title-wrapper {
margin-top: 0;
}
.center {
text-align: center;
}
.title:not(.notification .title):not(.cart-title .title):not(.main-list-collection-banner .title):not(.product-banner-slider__wrapper .title) {
font-weight: 700;
}
.multicolumn .title {
margin: 0;
width: 100%;
}
.text-color-heading-secondary {
color: #ff3aa3;
font-family: Nunito, sans-serif;
font-style: normal;
letter-spacing: normal;
line-height: 1.2;
word-break: break-word;
}
slider-component {
--desktop-margin-left-first-item: 195px;
position: relative;
display: block;
}
.grid:last-child {
margin-bottom: 0;
}
.multicolumn-list {
margin-top: 0;
padding: 0;
}
.grid {
display: flex;
flex-wrap: wrap;
list-style: none;
}
.multicolumn-list__item {
position: relative;
}
.grid__item {
flex-grow: 1;
flex-shrink: 0;
}
.multicolumn:not(.background-none) .multicolumn-card {
height: 100%;
}
.multicolumn:not(background-none) .multicolumn-card {
border-radius: 10px;
}
.image-position-top {
background-color: #ffd2ea;
}
.multicolumn-card {
display: flex;
flex-direction: column;
position: relative;
overflow: hidden;
box-sizing: border-box;
}
.content-container {
border: 0px solid #1010101a;
}
.multicolumn-card__info {
position: relative;
z-index: 1;
padding: 25px 25px 30px;
}
.multicolumn-list .multicolumn-card__info .inline-richtext {
line-height: 36.4px;
}
.multicolumn-list h3 {
margin: 0;
}
.text-weight-600 {
font-weight: 600;
}
.center .multicolumn-card__info>.rte {
margin-right: auto;
margin-left: auto;
}
.multicolumn-card__info>:nth-child(2) {
margin-top: 10px;
}
.text-color-main {
color: #101010;
}
.multicolumn-list .multicolumn-card__info p {
line-height: 24px;
font-size: 16px;
letter-spacing: normal;
font-family: Poppins, sans-serif;
font-style: normal;
font-weight: 400;
}
.rte>*:last-child {
margin-bottom: 0;
}
.rte>*:first-child {
margin-top: 0;
}
.multicolumn-list p {
margin: 0;
}
.rte a {
color: inherit;
text-underline-offset: 3px;
text-decoration-thickness: 1px;
transition: text-decoration-thickness .1s ease;
text-decoration: underline;
}
.rte a:hover {
color: inherit;
text-decoration-thickness: 2px;
}
.rte:after {
clear: both;
content: "";
display: block;
}
.content-container:after {
content: "";
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
border-radius: 0px;
box-shadow: 0px 4px 5px #10101000;
z-index: -1;
}
.button:not(.scroll-to-top__button) {
padding: 10px 30px;
}
:is(.button, .shopify-challenge__button, .customer button, button.shopify-payment-button__button--unbranded) {
min-height: 40px;
height: 40px;
line-height: 20.8px;
text-transform: capitalize;
}
.center .button {
color: #ffffff;
background-color: #ff3aa3;
position: relative;
overflow: hidden;
z-index: 1;
}
.button {
display: inline-flex;
justify-content: center;
align-items: center;
cursor: pointer;
font: inherit;
text-decoration: none;
appearance: none;
letter-spacing: initial;
font-size: 16px;
font-weight: 700;
border: 1px solid #ff3aa3;
border-radius: 40px;
transition: all .1s ease;
}
.button:before {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #ff3aa3;
z-index: -1;
}
.button:after {
content: "";
position: absolute;
top: -.1rem;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 40px;
background-color: #ffffff;
transform: translate(-101%);
transition: all .4s ease-in-out;
z-index: -1;
}
@keyframes animateAmbientOverlay {
0% {
transform: translate(-50%, -50%) scale(1) rotate(0);
}
25% {
transform: translate(-45%, -55%) scale(.96) rotate(-4deg);
}
50% {
transform: translate(-55%, -45%) scale(1.03) rotate(4deg);
}
75% {
transform: translate(-45%, -55%) scale(.96) rotate(-4deg);
}
100% {
transform: translate(-50%, -50%) scale(1) rotate(0);
}
}
@media (prefers-reduced-motion: no-preference) {
.scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-rotate-in {
animation: slideRotateIn .6s cubic-bezier(0, 0, .3, 1) forwards;
animation-delay: 75ms;
}
.scroll-trigger.animate--slide-rotate-in {
transform-origin: center bottom;
}
.scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-in {
animation: slideIn .6s cubic-bezier(0, 0, .3, 1) forwards;
animation-delay: calc(1 * 75ms);
}
}
@media screen and (min-width: 750px) {
.page-width {
padding: 0 50px;
}
.title-wrapper.center {
margin-left: auto;
margin-right: auto;
}
.title-wrapper {
max-width: 650px;
margin-bottom: 40px;
}
.text-color-heading-secondary {
font-size: 30px;
}
.grid {
column-gap: 30px;
row-gap: 28px;
}
.multicolumn-list__item {
padding-bottom: 0;
}
.grid__item {
max-width: 480px;
}
.text-weight-600 {
font-size: 26px;
}
.multicolumn .button {
margin-top: 40px;
}
}
@media screen and (min-width: 950px) {
.grid--3-col-desktop .grid__item {
width: 313.292px;
}
}
@media screen and (min-width: 1025px) {
#shopify-section-template--26565450301745__multicolumn_ppBg3m .section-overlay .section-image-overlay {
width: 10%;
/* top: 10%; */
left: 95%;
}
#shopify-section-template--26565450301745__multicolumn_ppBg3m .section-overlay .section-image-overlay.overlay-2 {
width: 10%;
top: 80%;
left: 1%;
}
}
@media screen and (max-width: 749px) {
.section-responsive-padding {
padding-top: 13.78px;
padding-bottom: 37.1px;
}
.multicolumn-list:not(.slider--mobile).grid {
row-gap: 40px;
}
.multicolumn-list:not(.slider) {
padding-left: 15px;
padding-right: 15px;
}
.multicolumn-list {
margin: 0;
width: 100%;
}
.button {
font-size: 16px;
}
.title-wrapper {
margin-top: 0;
margin-bottom: 40px;
}
}
@media screen and (max-width: 989px) {
.grid--1-col-tablet-down .grid__item {
width: 100%;
max-width: 100%;
}
.multicolumn-list__item.mobile-center .multicolumn-card__info {
text-align: center;
}
.multicolumn-list__item.mobile-center .multicolumn-card__info .rte {
margin-left: auto;
margin-right: auto;
}
.multicolumn-card__info>.rte {
max-width: 400px;
}
.button:not(.scroll-to-top__button) {
height: auto;
}
}
@media screen and (max-width: 1024px) {
#shopify-section-template--26565450301745__multicolumn_ppBg3m .section-overlay .section-image-overlay {
width: 27%;
/* top: 4%; */
left: 94%;
}
#shopify-section-template--26565450301745__multicolumn_ppBg3m .section-overlay .section-image-overlay.overlay-2 {
width: 15%;
top: 90%;
left: 1%;
}
}
</style>
<section id="shopify-section-template--26565450301745__multicolumn_ppBg3m" class="shopify-section section">
<link href="//stylobug.com/cdn/shop/t/66/assets/section-multicolumn.css?v=115722156166684919691776954311"
rel="stylesheet" type="text/css" media="all">
<link href="//stylobug.com/cdn/shop/t/66/assets/component-slider.css?v=117175392398318864621776954311"
rel="stylesheet" type="text/css" media="all">
<div class="multicolumn gradient section-responsive-padding layout--default color-main-bg section-overlay">
<img
src="https://cdn.shopify.com/s/files/1/0743/8175/4566/files/a0a0f0e2-a4ec-4597-8baa-0b477e431e44hgh.png?v=1779352838&width=188"
alt="background shape" width="188" height="188" loading="lazy" sizes="(min-width: 1600px) 100vw,
(min-width: 750px) calc(100vw - 130px), calc(100vw - 50px)" class="section-image-overlay ambient">
<!-- <img src="//stylobug.com/cdn/shop/files/Sunflower.png?v=1770232989&width=188" alt="background shape" width="188"
height="188" loading="lazy" sizes="(min-width: 1600px) 100vw,
(min-width: 750px) calc(100vw - 130px), calc(100vw - 50px)" class="section-image-overlay overlay-2 ambient"> -->
<div class="page-width isolate">
<div class="title-wrapper center">
<h2 class="title inline-richtext h3 text-color-heading-secondary scroll-trigger animate--slide-rotate-in">
Kidsy Clothing Enterprises
</h2>
</div>
<slider-component class="slider-mobile-gutter">
<ul class="multicolumn-list contains-content-container grid grid--1-col-tablet-down grid--3-col-desktop"
id="Slider-template--26565450301745__multicolumn_ppBg3m" role="list">
<li id="Slide-template--26565450301745__multicolumn_ppBg3m-1"
class="multicolumn-list__item grid__item center mobile-center scroll-trigger animate--slide-in"
data-cascade="" style="--animation-order: 1;">
<div class="multicolumn-card content-container image-position-top color-bg-1">
<div class="multicolumn-card__info">
<h3 class="inline-richtext h4 text-color-heading-secondary text-weight-600">
WhatsApp
</h3>
<div class="rte text-color-main">
<p>
<a href="tel:+918980331672">+91 89803 31672</a>
</p>
</div>
</div>
</div>
</li>
<li id="Slide-template--26565450301745__multicolumn_ppBg3m-2"
class="multicolumn-list__item grid__item center mobile-center scroll-trigger animate--slide-in"
data-cascade="" style="--animation-order: 2;">
<div class="multicolumn-card content-container image-position-top color-bg-1">
<div class="multicolumn-card__info">
<h3 class="inline-richtext h4 text-color-heading-secondary text-weight-600">
Address
</h3>
<div class="rte text-color-main">
<p>Surat, Gujarat.</p>
</div>
</div>
</div>
</li>
<li id="Slide-template--26565450301745__multicolumn_ppBg3m-3"
class="multicolumn-list__item grid__item center mobile-center scroll-trigger animate--slide-in"
data-cascade="" style="--animation-order: 3;">
<div class="multicolumn-card content-container image-position-top color-bg-1">
<div class="multicolumn-card__info">
<h3 class="inline-richtext h4 text-color-heading-secondary text-weight-600">
Email
</h3>
<div class="rte text-color-main">
<p>
<a href="mailto:kidsyclothing.com@gmail.com">kidsyclothing.com@gmail.com</a>
</p>
</div>
</div>
</div>
</li>
</ul>
</slider-component>
<div class="center">
<a class="button" href="https://api.whatsapp.com/send?phone=918980331672">
WhatsApp Us
</a>
</div>
</div>
</div>
</section>