/* beacon indicator */
#nf_blinky {
display: none;
position: absolute;
width: 48px;
height: 48px;
z-index: 9999999999;
cursor: pointer;
}
#nf_blinky:hover {
opacity: 0;
visibility: hidden;
z-index: -1;
}
.nf-blinker::before,
.nf-blinker::after {
display: block;
content: '';
position: absolute;
background: #ef4748;
border-radius: 100%;
}
.nf-blinker::before {
top: 8px;
right: 8px;
bottom: 8px;
left: 8px;
border: 4px solid #fff;
z-index: 1;
box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
}
.nf-blinker::after {
top: 10px;
right: 10px;
bottom: 10px;
left: 10px;
animation: nf-pulse-out 1200ms ease infinite;
}
@keyframes nf-pulse-out {
100% {
transform: scale(2);
opacity: 0;
}
}
/* Pixel Tip Buttons */
.nf-pixel-tip .next {
display: block;
margin: 15px auto 0px;
background: #000;
border-radius: 5px;
padding: 8px;
width: 30%;
font-size: 140%;
color: #fff;
cursor: pointer;
text-decoration: none;
}
.nf-pixel-tip .next:hover {
background: #ef4748;
}
.nf-pixel-tip a {
color: #ef4748;
text-decoration: underline;
cursor: pointer;
}
.nf-pixel-tip a:hover {
text-decoration: none;
}
/* Glowing element for multi-select options */
input.glow, .glow a {
animation: nf-pulse-border 2400ms ease infinite;
}
@keyframes nf-pulse-border {
50% {
box-shadow: 2px 2px #ef4748, 2px -2px #ef4748, -2px 2px #ef4748, -2px -2px #ef4748;
}
}
/* backdrop */
#nf_curtain {
display: none;
position: fixed;
width: 100%;
height: 100%;
z-index: 10999999;
background: rgba(0, 0, 0, 0.6);
top: 0;
left: 0;
}
/* pixelated bubble tips */
div[class^='nf-pixel-tip'], div[class*=' nf-pixel-tip'] {
position: fixed;
top: 5px;
left: 145px;
display: none;
z-index: 999999999999;
margin: 20px;
text-align: center;
font-size: 16px;
line-height: 1.3em;
background-color: #fff;
color: #000;
padding: 12px;
box-shadow: 0 -4px #fff, 0 -8px #000, 4px 0 #fff, 4px -4px #000, 8px 0 #000, 0 4px #fff, 0 8px #000, -4px 0 #fff, -4px 4px #000, -8px 0 #000, -4px -4px #000, 4px 4px #000, 4px 12px rgba(0, 0, 0, 0.1), 12px 4px rgba(0, 0, 0, 0.1), 8px 8px rgba(0, 0, 0, 0.1);
box-sizing: border-box;
width: 350px;
}
div[class^='nf-pixel-tip']::after, div[class*=' nf-pixel-tip']::after, div.nf-pixel-tip-floating::before {
content: "";
display: block;
position: absolute;
box-sizing: border-box;
height: 4px;
width: 4px;
top: 16px;
left: -8px;
background: white;
box-shadow: -4px -4px #fff, -4px 0 #fff, -8px 0 #fff, 0 -8px #fff, -4px 4px #000, -8px 4px #000, -12px 4px #000, -16px 4px #000, -12px 0 #000, -8px -4px #000, -4px -8px #000, 0 -4px #fff;
transform: scaleY(-1);
}
div.nf-pixel-tip.dashboard {
position: absolute;
top: 0px;
}
div.nf-pixel-tip-l {
width: 560px;
font-size: 24px;
text-align: left;
text-transform: uppercase;
}
div.nf-pixel-tip-thinking {
display: none;
}
div.nf-pixel-tip-thinking, div.nf-pixel-tip-floating::before {
height: 19px;
width: 19px;
font-size: 30px;
text-align: center;
line-height: 1;
padding: 0px 2px;
}
div.nf-pixel-tip-floating {
display: none;
margin-top: 72px;
}
div.nf-pixel-tip-thinking::after, div.nf-pixel-tip-floating::after, div.nf-pixel-tip-floating::before {
height: 6px;
width: 6px;
bottom: -20px;
left: -16px;
box-shadow: 0 -4px #fff, 0 -8px #000, 4px 0 #fff, 4px -4px #000, 8px 0 #000, 0 4px #fff, 0 8px #000, -4px 0 #fff, -4px 4px #000, -8px 0 #000, -4px -4px #000, 4px 4px #000, 4px 12px rgba(0, 0, 0, 0.1), 12px 4px rgba(0, 0, 0, 0.1), 8px 8px rgba(0, 0, 0, 0.1);
}
div.nf-pixel-tip-floating::after {
width: 12px;
height: 12px;
top: -35px;
left: 26px;
}
div.nf-pixel-tip-floating::before {
top: -52px;
left: 7px;
}
div.nf-pixel-tip-floating span {
position: absolute;
top: -70px;
left: -16px;
font-size: 40px;
}
في ظل التحول الرقمي المتسارع، أصبح التسويق الإلكتروني أحد أهم الأدوات التي تعتمد عليها المؤسسات والشركات لتحقيق الانتشار والوصول إلى جمهور أوسع.
في هذا الحوار التسجيلي، نسلّط الضوء على مفهوم التسويق الإلكتروني، أهميته في العصر الحديث، وكيف غيّر قواعد اللعبة في عالم المال والأعمال.
ال