/* original styles.css */


body {


margin: 0;


padding: 0;


font-family: Arial, sans-serif;


}


body{margin:0;padding:0;font-family:Arial,sans-serif}


section:first-of-type .container {


max-width: 100%


}


.product-single .flex.whitespace-nowrap.gap-4.items-center {


flex-direction: column;


align-items: revert;


}


.product-single .flex.whitespace-nowrap.gap-4.items-center salla-count-down ul{


padding-right: 0;



}


section.s-block.s-block--fixed-banner:nth-of-type(2n+4) {


text-align: center;


display: block;


margin-left: auto;


margin-right: auto;


transition: transform .3s;


animation: banners 1.4s ease-in-out 2.5s infinite!important


}


.s-count-down-dark .s-count-down-item {


color: rgb(255 255 255);


background: linear-gradient(90deg, #f87171 0%, #fbbf24 100%);


}


.s-count-down-item-label{


color: rgb(255 255 255);


opacity: 1.4;


font-size: 18px;


font-weight: 700;


}


@keyframes logobg {


0% {


transform: scale(1)


}



20% {


transform: scale(1)


}



78% {


transform: scale(1)


}


}



s-block.s-block--fixed-banner.wide-placeholder {


margin-top: 0


}



.s-block.s-block--fixed-banner.wide-placeholder .container {


margin: 0;


padding: 0;


max-width: initial


}



.main-nav-container.fixed-header .inner,.main-nav-container,.top-navbar,.footer-is-light .store-footer,.footer-is-light .store-footer .store-footer__inner {


background: #E09B00;


background: linear-gradient(90deg,#E09B00 0%,#FFD14B 100%);


background-size: cover;


background-repeat: no-repeat;


font-family: 'Tajawal', sans-serif;



font-size: 16px;


font-weight: 400;


}



.bg-gray-50 {


background-color: #fff


}



.s-product-card-vertical {


box-shadow: rgba(0,0,0,.19) 0 10px 20px,rgba(0,0,0,.23) 0 6px 6px


}


.flex.whitespace-nowrap.gap-4.items-center .gap-4.flex >span {


display: none;


}




@media only screen and (max-width: 600px) {


.salla-slider .slide--one-sixth {


width:37%


}



.slide--cat-entry {


}



.s-products-slider-card {


max-width: 184px


}


}



::-webkit-scrollbar {


width: 10px


}



::-webkit-scrollbar-track {


box-shadow: inset 0 0 5px #fff;


border-radius: 10px


}



::-webkit-scrollbar-thumb {


background: #dec9b2;


border-radius: 10px


}



::-webkit-scrollbar-thumb:hover {


background: #d8ae5f


}



.lg\:shadow-default,.s-user-menu-trigger,.banner--fixed img,.xs\:p-7,.no-content-placeholder .icon,.s-block--features__item,.lg\:p-8 {


background: 0 0!important


}



.md\:mb-0 {


margin-left: 17px


}



.s-block--features__item:first-child {


grid-column: span 1/span 2


}



.lg\:grid-cols-3 {


grid-template-columns: repeat(3,minmax(0,1fr))


}



.s-block--features__item h4 {


white-space: nowrap


}



.s-block--features__item p {


min-width: 83px


}



.s-block.s-block--features.container:before {


content: ' مميزات المتجر ';


display: block;


text-align: center;


font-size: 28px;


font-weight: 600;


color: #000


}



.s-slider-block__title h2 {


color: #000


}



.s-block--features__item .feature-icon {


height: 5rem;


width: 5rem


}



.s-slider-block__display-all {


background: #fbbf24;


color: #fff;


padding: 10px;


border-radius: 20px;


border-radius: 15px 15px 0 15px!important;


padding-bottom: 12px


}



.s-block--features__item .feature-icon {


box-shadow: rgb(254 252 252/24%) 0 3px 8px


}



.store-footer h3 {


color: #344a50!important;


background: #fff;


border-radius: 8px;


font-weight: 700;


padding-top: .3rem;


width: 100%;


padding-bottom: .3rem;


box-shadow: rgba(0,0,0,.1) 0 4px 12px


}



.main-nav-container.fixed-pinned .main-menu>li>a, .sicon-menu:before {


color: #000;


}



.footer-is-light .store-footer .social-link {


border-color: transparent;


box-shadow: rgba(0,0,0,.24) 0 3px 8px


}



.store-footer .contact-social ul li:first-child a {


background: #cc38a5;


color: #fff


}



.store-footer .contact-social ul li:nth-child(2) a {


background: #5098fd;


color: #fff


}



.store-footer .contact-social ul li:nth-child(3) a {


background: #d8c837;


color: #fff


}



.store-footer .contact-social ul li:nth-child(4) a {


background: #333;


color: #fff


}



.store-footer .contact-social ul li:nth-child(5) a {


background: #f50000;


color: #fff


}



.store-footer .contact-social ul li:nth-child(6) a {


background: #0084ff;


color: #fff


}



@media only screen and (max-width: 600px) {


.s-block.s-block--fixed-banner.wide-placeholder .container {


margin:0;


padding: 0


}


}



[dir=ltr] .mm-spn.mm-spn--navbar.mm-spn--main:after,[dir=rtl] .mm-spn.mm-spn--navbar.mm-spn--main:after,[dir=rtl] .mm-spn.mm-spn--navbar:after {


text-align: inherit;


color: #000


}



.flex.mb-6,.md\:flex,.s-product-card-content-sub,.store-footer a,.s-product-card-content-title a,.store-footer .contact-social ul,.footer-is-light .store-footer .store-footer__inner {


text-align: center!important;


justify-content: center!important


}



.s-slider-nav-arrow svg {


fill: #fff


}



.store-footer a .rtl\:ml-2\.5,.header-btn i,.header-btn__icon.icon,.s-slider-next.s-slider-nav-arrow,.s-slider-next.s-slider-nav-arrow.swiper-button-disabled {


background: #bb6b00!important;


border: none;


color: #fff!important;


box-shadow: rgba(0,0,0,.24) 0 3px 8px


}



.s-slider-prev.s-slider-nav-arrow,.s-slider-prev s-slider-nav-arrow.swiper-button-disabled {


background: #dec9b2;


border: none;


box-shadow: rgba(0,0,0,.24) 0 3px 8px


}







.s-block--features__item .feature-icon {


animation: myani 1.5s ease-in-out alternate infinite;


position: relative;


transition: all 2s ease-in-out


}



@keyframes myani {


from {


top: 0


}



to {


transform: scale3d(0,-.2,-4.2);


box-shadow: rgb(26 23 23/65%) 0 3px 8px


}


}



.s-block.s-block--best-offers.container.overflow-hidden,.lg\:shadow-default,.s-user-menu-trigger,.banner--fixed img,.xs\:p-7,.no-content-placeholder .icon,.s-block--features__item,.lg\:p-8,.footer-is-light .store-footer .store-footer__inner,.footer-is-light .store-footer .contact-social {


border-color: transparent!important


}



.topnav-link-item,.main-menu li.root-level>a,.s-cart-summary-total,.text-gray-400,.store-footer a,.s-button-text {


color: black;


}



.text-primary {


color: #000


}



.main-nav-container.fixed-header .inner {


margin-top: 10px;


border: 1px solid #d7c3a8;


border-radius: 53px


}



.s-slider-block__display-all {


animation: signal 1200ms linear infinite


}



@keyframes signal {


0% {


box-shadow: 0 0 0 0 #000


}



100% {


box-shadow: 0 0 0 3px #fff


}


}



.footer-is-light .store-footer .store-footer__inner:before {


text-align: center;


content: "";


display: block;


height: 110px;


width: 140px;


margin: auto auto 20px;


background-image: url(https://cdn.salla.sa/cdn-cgi/image/fit=scale-down,width=400,height=400,onerror=redirect,format=auto/bVeEV/Oc2U6wXua1v3VGrtHOd69n5Ibvt03kUF6co6v1Qf.png);


background-repeat: no-repeat;


background-size: contain;


background-position: center;


animation: sial 1200ms linear infinite


}



footer:before {


content: "";


background-image: url(https://marssa.shop/site/images/new_theme/shape-4.svg);


background-size: 418%;


display: block;


background-repeat: round;


transform: rotate(180deg);


height: 104px;


margin: -4px -32px 1px 1px


}



@media only screen and (max-width: 600px) {


footer:before {


height:44px


}


}



.s-button-wrap svg {


fill: #f9fafb!important


}



.s-button-btn {


padding: .6em 2em;


border: none;


outline: none;


color: #fff;


background: #fff;


cursor: pointer;


position: relative;


z-index: 0;


border-radius: 10px;


user-select: none;


-webkit-user-select: none;


touch-action: manipulation


}



.s-button-btn:before {


content: "";


background: linear-gradient( 45deg,rgb(255,0,0),rgb(255,165,0),rgb(255,255,0) );


position: absolute;


top: -2px;


left: -2px;


background-size: 400%;


z-index: -1;


filter: blur(5px);


-webkit-filter: blur(5px);


width: calc(100% + 4px);


height: calc(100% + 4px);


animation: glowing-button-85 20s linear infinite;


transition: opacity .3s ease-in-out;


border-radius: 10px


}



@keyframes glowing-button-85 {


0% {


background-position: 0 0


}



50% {


background-position: 400% 0


}



100% {


background-position: 0 0


}


}



.s-button-btn:after {


z-index: -1;


content: "";


position: absolute;


width: 100%;


height: 100%;


background: #E09B00;


background: linear-gradient(90deg, #f87171 0%, #fbbf24 100%);


left: 0;


top: 0;


border-radius: 10px


}



.s-slider-block__title h2 {


text-transform: uppercase;


background-image: linear-gradient(-225deg, #0e0e0e 0%, #000 9%, #d1d5db 67%, #9b844b 100%);


background-size: 200% auto;


color: #fff;


font-weight: 700;


background-clip: text;


-webkit-background-clip: text;


-webkit-text-fill-color: transparent;


animation: textclip 2s linear infinite;


display: inline-block;


line-height: 27px;


padding-left: 55px;


padding-right: 26px;


font-size: 26px;


padding-bottom: 7px;


padding-top: 7px;


}



@keyframes textclip {


to {


background-position: 200% center


}


}



.slide--cat-entry {


background: 0 0


}



p.max-w-sm.leading-6.mb-6 {


color: black;


}



.copyright-text p {


--tw-text-opacity: 1;


color: black;}



.s-button-light-outline {


--tw-bg-opacity: 1;


background-color: #2b2d34;


fill: #6b7280;


--tw-text-opacity: 1


}



button.s-slider-prev.s-slider-nav-arrow.swiper-button-disabled {


background: #2b2d34


}



button.s-slider-prev.s-slider-nav-arrow {


background: #d8ae5f


}



.s-slider-nav-arrow svg:hover {


fill: #d8ae5f


}



.loader-init {


position: fixed;


top: 0;


left: 0;


width: 100vw;


height: 100vh;


display: flex;


align-items: center;


justify-content: center;


background: #FFD14B;


background-image: url(https://cdn.salla.sa/cdn-cgi/image/fit=scale-down,width=400,height=400,onerror=redirect,format=auto/bVeEV/Oc2U6wXua1v3VGrtHOd69n5Ibvt03kUF6co6v1Qf.png);


background-position: center;


background-size: 30%;


background-repeat: no-repeat;


transition: opacity .75s,visibility .75s;


z-index: 9999


}



.loader-init--hidden {


opacity: 0;


visibility: hidden


}



.loader-init::after {


content: "";


width: 36px;


height: 36px;


border: 3px solid #eee;


border-top-color: #5bd5c4;


border-radius: 50%;


animation: loading .75s ease infinite


}



@keyframes loading {


from {


transform: rotate(0turn)


}



to {


transform: rotate(1turn)


}


}



.bg-inherit {


background-color: #faebd700


}



.s-product-card-vertical .s-product-card-wishlist-btn button {


--tw-bg-opacity: 1 !important;


background-color: #ff6767!important;


border-radius: 50%;


animation: pulse 1s infinite


}



@keyframes pulse {


0% {


transform: scale(.9)


}



50% {


transform: scale(1.1)


}



100% {


transform: scale(.9)


}


}



#app>div.app-inner.flex.flex-col.min-h-full>section.s-block.s-block--banners.container>div {


display: grid;


grid-template-columns: repeat(4,1fr);


grid-gap: 8px;


}



#app>div.app-inner.flex.flex-col.min-h-full>section.s-block.s-block--banners.container>div>a {


position: relative


}



.lazy__bg {


position: absolute;


top: 0;


left: 0;


right: 0;


bottom: 0;


background-size: cover


}



.text-with-border {


position: absolute;


bottom: 0;


left: 0;


right: 0;


padding: 8px;


margin: 0;


color: #fff;


text-shadow: -1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;


opacity: 0;


transition: opacity .3s


}



.banner-entry:hover {


transform: scale(1.1);


filter: grayscale(100%)


}



.banner-entry:hover>.text-with-border {


opacity: 1


}



@media(max-width: 768px) {


#app>div.app-inner.flex.flex-col.min-h-full>section.s-block.s-block--banners.container>div {


grid-template-columns:repeat(2,1fr)


}


}



@media(max-width: 768px) {


.lazy__bg {


position:absolute;


top: 0;


left: 0;


right: 0;


bottom: 0;


background-size: cover;


object-fit: cover


}


}



.pulse {


width: 100px;


height: 100px;


background-color: blue;


animation: pulse 1s infinite


}



@keyframes pulse {


0% {


transform: scale(1);


opacity: 1


}



50% {


transform: scale(1.5);


opacity: .5


}



100% {


transform: scale(1);


opacity: 1


}


}



.navbar-brand img {


max-width: 201px!important;


}



.two-row .banner-entry:first-child {


grid-column: span 1/span 1;


grid-row: span 1/span 1


}



@media only screen and (max-width: 600px) {


.s-slider-block__title h2 {



font-size: 19px;


padding-bottom: 0px;


padding-top: 10px;


}


}



.s-block {


margin-top: 0


}



.s-slider-block__title {


border-radius: 39px;


padding-right: 10px;


padding-top: 5px;


padding-bottom: 10px;


padding-left: 10px;


box-shadow: rgb(236 232 232/24%) 0 3px 8px;


background: #e09b00;


background: linear-gradient(90deg, #f87171 0%, #fbbf24 100%);


margin-top: 34px;


}



#photos-0-slider>div.s-slider-block__title {


display: none


}



.lazy__bg.lazy.entered.loaded {


background-size: contain;


background-repeat: no-repeat;


column-gap: 26px;


grid-gap: 49px


}



.banner-entry {


background: 0 0


}


.s-block--features__item .feature-icon {


margin-bottom: .75rem;


display: flex;


height: 4rem;


width: 4rem;


align-items: center;


justify-content: center;


overflow: hidden;


border-radius: 9999px;


background-color: #414042;


background-color: var(--color-primary);


background: linear-gradient(90deg, #f87171 0%, #fbbf24 100%);


}



@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;700&display=swap');



#mobile-menu ul.main-menu li a:hover {


background-color: #f0f0f0;


}



#mobile-menu ul.main-menu li a {


font-family: 'Tajawal', sans-serif;


}


#app > div.app-inner.flex.flex-col.min-h-full{


font-family: 'Tajawal', sans-serif;




}


#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div.lg\:col-span-2.rtl\:lg\:pl-20.ltr\:lg\:pr-20 > p,


#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div:nth-child(2) > salla-menu,


#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div:nth-child(3) > salla-contacts > div {


font-family: 'Tajawal', sans-serif;


font-size: 16px;


font-weight: 700;


}


.index salla-count-down.s-count-down-wrapper.hydrated ul.s-count-down-list.s-count-down-boxed.s-count-down-md.s-count-down-dark {


padding: 0;


width: 36%;


margin: auto;


}


.index salla-count-down.s-count-down-wrapper.hydrated{


width:100%;


}


.index li.s-count-down-item {


height: 50px;


font-size: 15px;


}


salla-advertisement.hydrated {


background: linear-gradient(90deg, #fab62c 0%, #f87b67 100%);


}