#sp-header {
	background: rgba(250,242,247,0.9);
	box-shadow: 0 3px 3px rgba(0,0,0,0.05);
	height: 90px;
	left: 0;
	position: relative;
	top: 0;
	width: 100%;
	z-index: 99;
}
.sp-megamenu-wrapper .sp-megamenu-parent li a.scart {
    display: flex;
    align-items: center;
}

.sp-megamenu-wrapper .sp-megamenu-parent li a.scart i.fa-shopping-cart {
    order: 2;        /* ikonica ide POSLIJE teksta */
    margin-left: 6px; /* razmak između teksta i ikonice */
}
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
	display: inline-block;
	padding: 0px 20px;
	line-height: 40px;
	font-size: 17.8px;
	text-transform: none;
	letter-spacing: 1px;
	color: #5d5d5c;
	margin: 0px;
	font-family: Arial;
	font-weight: 400;
	margin-top: 26px;
	/* margin-right: 30px; */
}
.sp-megamenu-parent > li.active > a, .sp-megamenu-parent > li:hover > a {
	color: #ec609f;
}
.scart {
    background: #EC609F;
    background: -webkit-linear-gradient(0deg, rgba(236, 96, 159, 1) 0%, rgba(244, 161, 199, 1) 100%);
    background: -moz-linear-gradient(0deg, rgba(236, 96, 159, 1) 0%, rgba(244, 161, 199, 1) 100%);
    background: linear-gradient(0deg, rgba(236, 96, 159, 1) 0%, rgba(244, 161, 199, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#EC609F", endColorstr="#F4A1C7", GradientType=0);
	border: none;
	border-radius: 25px;
	cursor: pointer;
	color: #fff !important;
    font-weight: bold !important;
    font-size: 22px !important;
}
.scart:hover {
    background: #EC61A0;
    background: -webkit-linear-gradient(180deg, rgba(236, 97, 160, 1) 0%, rgba(244, 161, 199, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(236, 97, 160, 1) 0%, rgba(244, 161, 199, 1) 100%);
    background: linear-gradient(180deg, rgba(236, 97, 160, 1) 0%, rgba(244, 161, 199, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#EC61A0", endColorstr="#F4A1C7", GradientType=0);
}
.sppb-addon-header.more {
  animation-name: pulse;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}
@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}
#sp-footer {
	color: #939493;
	background: #fff0;
	font-family: Arial;
	font-size: 18px;
	font-weight: 500;
}
.offcanvas-menu {
	padding: 10px;
}
#offcanvas-toggler > i {
	color: #ec609f;
	font-size: 25px;
}
#mod-custom112 {
	float: right;
	line-height: 84px;
	margin-left: 20px;
	font-size: 21px;
	color: #ec609f;
}
@media (max-width: 855px) {
    #sp-header {
	background: rgba(250,242,247,0.9);
	box-shadow: 0 3px 3px rgba(0,0,0,0.05);
	height: 40px;
	left: 0;
	position: relative;
	top: 0;
	width: 100%;
	z-index: 99;
   }
   #sp-header .logo {
	display: inline-block;
	height: 40px;
	display: table;
	-webkit-transition: all 400ms ease;
	transition: all 400ms ease;
	margin: 0;
    }
    #offcanvas-toggler {
	float: right;
	line-height: 44px;
	margin-left: 15px;
	font-size: 20px;
    }  
	#mod-custom112 {
	float: right;
	line-height: 42px;
	margin-left: 15px;
	font-size: 20px;
	color: #ec609f;
	order: 2;
	display: inline;
}
}
/* 	By default Helix 3 mega menu is adjust to off-canva in a screen resolution below 480px. 
If you want to have off-canvas menu for a bigger screen resolution just add below CSS code to your custom css file.*/

@media (max-width: 1330px){
.sp-megamenu-parent {
    display: none !important;
  }
#offcanvas-toggler {
    display: inline-block !important;
  }
}
@media (min-width: 1330px){
#mod-custom112 {
    display: none !important;
  }
}