/* Add custom CSS styles below */ 

/*
 ibrahim mdoukh
+970 567 304 260
 */ 
.salla-theme_1 header.site-header .logo-wrapper .logo img{
    max-height:65px;
animation: pop 4s ease 1 forwards;
}
@keyframes pop {
  0% {
    transform: scale(0);
  } 100% {
    transform: scale(1)
  }  
}
.site-header{border-bottom:2px solid white;
border-radius:35px 35px 0 0;}
.slick-slider{background:#fff;
Border:2px solid #fff;
Border-radius:20px;}

.circle-action{color:#fff;
background:#6b70ee;
border:2px solid #6b70ee;
border-top-left-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 0;
font-weight:bold!important;
box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
animation: Roll 1s ease 0s 1 normal forwards;}
@keyframes Roll {
	0% {
		opacity: 0;
		transform: translateX(-250px) rotate(-200deg);
	}

	100% {
		opacity: 1;
		transform: translateX(0) rotate(0deg);
	}}}
	
body{background:#fff;}
.site-header__cart .badge {background: #fff;
color:#6b70ee;
top:-10px;}
.banner img {
  margin: 0px auto !important;
  /* margin-top: -16px !important; */
}
section:nth-of-type(1) {
  margin-top: 0px !important;
}
.section-header.d-flex.justify-content-between.align-items-center.mb-4 {
  margin-top: 5px !important;
}
section:nth-of-type(1) .container.container.p-0.px-md-3,
section:not(:nth-of-type(2)) > .container.banner {
  padding: 0px !important;
  margin: auto !important;
  width: 100vw;
   -webkit-animation: bounce-in-top 2s both;
    animation: bounce-in-top 2s both;
}

@-webkit-keyframes bounce-in-top {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: translateY(-65px);
        transform: translateY(-65px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: translateY(-28px);
        transform: translateY(-28px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    90% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}



      .sub-nav__menu svg{
    fill:#241CA6;}
 
 .sub-nav__close svg {
    fill: #fff;
}
 
 
 
 .sub-nav .main-menu li.sub-menu-header.categories-holder > span {
 border-top:none;   
}
.sub-nav-header {
  background: #6b70ee;
}


.sub-nav .sub-nav-content.is-active {
  background-color: #6b70ee;
border-top-left-radius: 25px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 0;
border:4px solid #fff;
box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
margin-top:50px;
height:680px;
}


.sub-nav-header img {
  content: url(https://cdn.salla.sa/enBrq/khg679iI2Ustiq2GgzeqZqcsICyd0mgl6UHMq1A7.png) !important;
  filter: brightness(100);
  width: 150px !important;
  height: auto;
  border-radius: 0 !important;
  border: none !important;
}

.sub-nav .main-menu li.sub-menu-header.categories-holder ul.store-categories li a ,.sub-nav li > ul a:hover , .sub-nav .main-menu li.sub-menu-header.categories-holder ul.store-categories li.has-children > a::after {
  color: white!important;
  text-align: center !important;

}

.sub-nav .main-menu li.sub-menu-header.categories-holder ul.store-categories li {
  border-bottom: none !important;
}
.sub-nav-header a {
  background: white;
  border-top-left-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 0;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
}
.sub-nav .main-menu li.sub-menu-header.categories-holder > span {
  visibility: hidden;
}

.sub-nav .main-menu li.sub-menu-header.categories-holder > span::after {
  visibility: visible;
  content: "التصنيفات";
  font-weight: bold;
  font-size: 18px!important;
  color:#fff;
}
.sub-nav .sub-nav-content .main-menu > li {
  border-bottom: none ;
}

.sub-nav .main-menu li.sub-menu-header.categories-holder ul.store-categories li ul li a {
    color: #6b70ee!important;
    font-weight: 400 !important;;
}

.sub-nav .main-menu li.sub-menu-header.categories-holder ul.store-categories li ul li {
  border-bottom: none !important;

}

p.font-13 > span {
  display: none;
}

.banner img
{
    border: 4px solid #fff;
    border-top-left-radius: 12px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 0;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
    animation-duration : 2.5s; animation-fill-mode : both; animation-iteration-count : 1; animation-name : fastSlide; animation-timing-function : linear; transform-origin : bottom; } @keyframes fastSlide { 0% { transform: translate(120%) skewX(-30deg) ; } 70% { transform: translate(0%) skewX(-30deg) ; } 80% { transform: translate(0%) skewX(20deg) ; } 95% { transform: translate(0%) skewX(-10deg) ; } 100% { transform: translate(0%) skewX(0deg) ; } }

.section-header {font-size: 22px!important;
    justify-content: center;}
.section-header .section--title {
    padding: 3px 1rem;
    animation: shake 8s  infinite;
}

@keyframes shake {
25% {
    Translate: 6px 0;
}
50%{
Translate:-6px 0;
}
 75% {
translate: 6px 0;
}}

.section-header .section--title span{
  color:#fff;
  padding-left:4px;
  padding-right:4px;
  background-color: #6b70ee;
  border-top-left-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 0;
  border:4px solid #6b70ee;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
  padding-bottom: 5px!important;
  margin-right: 1px;
  }
.product>a .img-cont img
{
    width: 100% !important;
    margin: auto !important;
    margin-top: 0px !important;
    border-bottom:2px solid #fff;
    border:none;
    }
.product
{
    border: 2px solid #6b70ee;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
    border-top-left-radius: 15px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 0;
}



.product:hover
{
    margin-top: 5px !important;
    margin-left: 5px !important;
    box-shadow: 0 0 15px 8px #c8c8c8;
    animation: tournemoi ease 1s;
}
@keyframes tournemoi {
    0% {
        transform: rotate(-2deg);
    }
    40% {
        transform: rotate(2deg);
    }
    100% {
        transform: rotate(0);
    }
}


.product > a:nth-child(1) {
  border-radius: 8px!important;
}
h3.product-title {
  color: #6b70ee;
  font-weight:bold;
  margin-top: 5px;
}

.product-subtitle {
color:#212121!important;
  text-align: center !important;
  transition: 4s 0 ease;
    animation: flash 5s ease infinite;
    animation-direction: alternate;
    
}
@keyframes flash
{
    0%, 50%, 100% 
    {
        opacity: 1;
    }
    25%, 75%
    {
        opacity: 0;
    }
}
body .product .product-footer {
  display: block;
  border: none;
}
.product-footer .not-available,
.product-add {
  font-size: 1rem;
  background-color: #6b70ee;
  color: #fff;
  margin: 10px 5% !important;
  padding: 0.35rem 0 !important;
  display: block;
  text-align: center;
  border-top-left-radius: 12px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 0;
  border:2px dotted #6b70ee;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
  animation: wiggle 2.5s infinite;}
@keyframes wiggle { 0% { transform: rotate(0deg); } 80% { transform: rotate(0deg); } 85% { transform: rotate(5deg); } 95% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } }

.product-add:before {
  content: "أضف للسلة";
  display: block;
}
.product-add * {
  display: none;
}
.product-price {
  text-align: center;
  font-weight:bold;
}
.not-available {
  text-align: center;
  cursor: no-drop;
  color: gray !important;
  padding: 0px 0px 10px !important;
}
.product .product-title {
color:#6b70ee;
font-weight:bold;
  text-align: center;
}
.promotion-title {
    background-color: #6b70ee;
    color:#fff !important;
    animation: pulse 5s infinite !important;
}

@keyframes pulse {
    0% {
        background-color: #B7A7CB;
    }
    50% {
        background-color: #3F1374;
    }
    100% {
        background-color: #171717;
    }
}

/*----------------- Products Details -----------------*/
.owl-carousel .owl-item img
{
    width: 100%;
    border: 2px solid white!important;
    border-radius: 35px !important;
    box-shadow: 1px 1px 6px 1px #c8c8c8;
    position: relative;
    animation: up-down 6s ease infinite;
}
@keyframes up-down
{
    0%, 100%
    {
        top: 0;
    }
    50%
    {
        top: -25px;
    }
}


.owl-carousel .owl-stage
{
    margin-top: 25px !important;
}

#order .add-cart-large
{background:#6b70ee;
    font-weight: 600;
    border-radius: 35px !important;
border:2px solid white;
box-shadow: 1px 1px 6px 1px #c8c8c8;
}

.fa-heart:before
{
    color: #8f8076 !important;
}

.list>li:first-child
{
    border: 2px solid var(--primary-color) !important;
    border-radius: 30px !important;
}

qty-field--custom .btn--qty-sub
{
    border-radius: 35px !important;
border:2px solid white;
box-shadow: 1px 1px 6px 1px #c8c8c8;
}

body.font-apple .product-form .list--product-fields li.form-group>label
{
    font-size: 15px;
    font-weight: 600;
    margin-top: 6px !important;
}
/*------------- End of Products Details --------------*/

.section .section-header .circle-action {
  color: #241CA6;
  background-color: #fff;
  border: 1px solid #6b70ee;
  border-radius: 35px;
  text-shadow: 1px 1px 1px #000; 
  transition: all 0.3s ease-in-out;
}
    
.section .section-header a.button-more,
body.salla-theme_1 .section-header .btn.btn-primary.btn-rounded {
  border-radius: 35px !important;
  color: #6b70ee !important;
  background-color: #fff !important;
  border: 1px solid #241CA6 !important;
}
.section .section-header .circle-action:hover,
.section .section-header a.button-more:hover,
body.salla-theme_1 .section-header .btn.btn-primary.btn-rounded:hover {
  color: #241CA6;
  background-color: #fff !important;
  border: 1px solid #241CA6 !important;
}
‎/* ===  لون  أراء العملاء  ==== */
.section--title {color: #6b70ee;
font-weight:bold;}
@media only screen and (max-width: 767px){
body .section-header h2.section--title span {font-size: 22px!important;}  
}
.testimonials-item {
  margin: 3px;
  background: #6b70ee;
  border: 4px solid #6b70ee;
  border-top-left-radius: 20px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 0;}
.testimonials-item p {
  background: #6b70ee;
  border-radius: 12px;
  font-weight:bold;
  color: #ffff;
  width: 88%;
  padding: 3rem 1rem 0.5rem;
  margin-bottom: 0px !important;
  text-align: right;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.testimonials-item p:before {
  border-top-color: #0f0f0f;
  display: none;
}
.testimonials-item cite {
  color: #BDBDBD;
}
.testimonials-item img {
  display: none;
}
.testimonials-item__location {
  margin-right: 10px;
}
span.testimonials-item__author {
  color: #6b70ee;
  margin-right: 26px;
}
.testimonials-item .rating {
  display: block;
  position: absolute;
  top: 13px;
  right: 106px;
  font-size: 19px;
  letter-spacing: 5px;
}

/* box shap */
cite.d-flex.pr-4 > div {
  margin-bottom: 8px;
}
.text-right {
  text-align: right !important;
  display: flex;
  align-items: center;
}











.feature-item { width: calc(33.333% - 10px); display: inline-block; vertical-align: top!important}


.feature-item__icon{border:2px solid white;
box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
animation: float 4s ease-in-out infinite;
    transition: all .4s ease;
    perspective: 1000px;
}

@keyframes float {
    0% {
        transform: translatey(0px);
    }

    50% {
        transform: translatey(-20px);
    }

    100% {
        transform: translatey(0px);
    }
}


}
.feature-item h3 { color: #6b70ee;
font-size:15px;}
.feature-item p { font-size: 13px;}
 .u-light {
        background-color: transparent;}
    
  div.container.footer-wrapper img {max-width: 67px;border:2px solid  #6b70ee;
    max-height: 38px;
    padding: 4px;
    border-top-left-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 0;
    box-shadow: 0px 0px 8px #1205052e;}
div.container.footer-wrapper img :hover{transition:transform 0.5s ease-in-out;

}
div.container.footer-wrapper img:hover {transform: scale(1.2);}
.footer-title span
{background:#fff;
border:2px solid #fff!important;
border-top-left-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 0;
    padding:2px 10px 4px 10px;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
    color: #6b70ee!important;
    font-weight:bold;
    font-size:19px;}
footer *{
    text-align: center !important;
    margin: auto;
    color: #fff!important;
}
.footer-main {
background:#6b70ee!important;
color:#fff;
    border:4px solid #6b70ee;
    border-top-left-radius: 30px;
    border-top-right-radius: 0;
    border-bottom-right-radius:30px;
    border-bottom-left-radius: 0;
   margin-left:4%;
   margin-right:4%;
   box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;}
    .footer-main, .store-contact {
    text-align-last: center;}
  .salla-theme_6 footer .footer-sub {
    
    background: #fff;
    color: #241CA6 !important;
}


    footer .footer-main .footer-item .social__item a * { color: #6b70ee;}
    .footer-links {
  color:#6b70ee;
    columns:1 !important;}
    .footer-main .container:before {
    text-align: center;
    content: "";
    display: block;
    height: 90px;
    width: 216px;
    margin: auto auto 20px;
    background-image: url(https://cdn.salla.sa/enBrq/khg679iI2Ustiq2GgzeqZqcsICyd0mgl6UHMq1A7.png);
    filter: brightness(100);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    /* border-top: 2px solid #ecd062; */
    /* border-radius: 3%; */
    transition: 5s 0 ease;
  animation: flash 5s ease infinite;
  animation-direction: alternate;
}
@keyframes flash
{
    0%, 50%, 100% 
    {
        opacity: 1;
    }
    25%, 75%
    {
        opacity: 0;
    }
}

footer .store-certificate img {
    max-width: 60px;
    max-height: 40px;
    margin-left: 4px;}
.footer-links a:hover, .footer-links a:focus, .footer-links a.active {text-decoration:none; color: #241CA6}

div.container.footer-wrapper img :hover{transition:transform 0.5s ease-in-out;
background:#6b70ee;
box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}
div.container.footer-wrapper img:hover {transform: scale(1.2);}

div#wa-nera-widget-send-button{
background:#6b70ee;
border-top-left-radius: 20px!important;
    border-top-right-radius: 0;
    border-bottom-right-radius:20px!important;
    border-bottom-left-radius: 0;
box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
animation: slide-in 1000ms;
}
@keyframes slide-in {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0%);
  }
}
footer .footer-main .footer-item .social__item a * { color: #6b70ee;
border-top-left-radius: 12px!important;
    border-top-right-radius: 0;
    border-bottom-right-radius:12px!important;
    border-bottom-left-radius: 0;}

.salla-theme_6 .product-details__social-share a {color:#6b70ee;}

   


body:after {
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    position: fixed;
    z-index: 999999;
    background: # url(https://cdn.salla.sa/enBrq/khg679iI2Ustiq2GgzeqZqcsICyd0mgl6UHMq1A7.png);
    left: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 160px;
    transform:scale(0);
        animation-name: pupup_logo;
    animation-duration: 2s;
}


@keyframes pupup_logo{
    0% {
transform:scale(0);
    }    
    18% {
transform:scale(1);
    }    
    75% {
transform:scale(1);
    }
   95% {
transform:scale(0);
    }
       100% {
transform:scale(0);
}
}









body.store-home:before {
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    background: #fff url(https://cdn.salla.sa/nrlAr/smrhFehDeXE2fBYGgj3LOs2zH4O31TmclUQ6Wb5K.png);
    position: fixed;
    z-index: 99999999999999999 !important;
    transform: scale(0);
    background-size: 165px !important;
    background-repeat: no-repeat;
    background-position: center !important;
    animation-name: logobg;
    animation-duration: 2s;
}
 
    @keyframes logobg {
    0% {
        transform: scale(1);
    }

    20% {
        transform: scale(1);
    }

    78% {
        transform: scale(2);
    }

    100% {
        transform: scale(0);
    }
}