/* =================================== */
/* fonts
/* =================================== */

@import url("../fonts/kc-nexa.css");

.NexaLight {
	font-family: "Nexa-Light";
}
.NexaBook {
	font-family: "Nexa-Book";
}
.NexaRegular {
	font-family: "Nexa-Regular";
}
.NexaBold {
	font-family: "Nexa-Bold";
}
.NexaExtraBold {
	font-family: "Nexa-ExtraBold";
}
.NexaHeavy {
	font-family: "Nexa-Heavy";
}
.NexaBlack {
	font-family: "Nexa-Black";
}

/* =================================== */
/* variables
/* =================================== */
:root {
/* Typography */
--font-family-default: 'Nexa-Regular', cursive;
--font-size-large: 2.6rem;
--font-size-medium: 2rem;
--font-size-default: 1.25rem;
--font-size-small: .8rem;
--font-weight-default: 400;
--lineheight-text-default: 1.25;
--lineheight-text-alt: .9;

/* Colour */
--color-primary: #f868cd;
--color-secondary: #04d1fc;
--color-background: #1a1d1f;
--color-background-selection: #000;
--color-base: #000;
--color-text-default: #fff;
--color-text-primary: #f868cd;
--color-text-secondary: #f868cd;
--color-text-link: #04d1fc;

/* Layout */
--grid-column-gap: 2vw;
--grid-row-gap: 5vh;
--max-width: 92rem;

/* Spacing */
--spacing-small: 0.5rem;
--spacing-default: 1rem;
--spacing-medium: 1.5rem;
--spacing-large: 4rem;

}

/* =================================== */
/* Bulma overrides to fix colour issues
/* =================================== */

.menu-list .menu-item, .menu-list a, .menu-list button {
	color: rgb(171, 177, 191);
}
.title {
	color: #fff !important;
}
.subtitle {
	color: #abb1bf !important;
}
.tabs a {
	color: #abb1bf ;
}
.dash-panel .notification-bar {
	color: #fff ;
}
.table, .table td, .table th {
	color: #fff !important;
}
.table.is-striped tbody tr:not(.is-selected):nth-child(2n) {
	background-color: #181b20 !important;
	color: #fff !important;
}
.table {
background-color: #14161a !important;
color: #fff !important;
}
.domain-btn {
	color: rgb(235, 236, 240) ;
	background-color: rgb(20, 22, 26) ;
	border-color: rgb(53, 58, 70) ;
}

/* =================================== */
/* Colours
/* =================================== */

a {
	color: var(--color-primary) ;
}
a:hover {
	color: var(--color-secondary);
}

.button {
	transition:all 0.3s;
}
.button.is-primary {
	background-color: var(--color-primary);
	border-color: transparent;
}
	.button.is-primary:hover {
		background-color: var(--color-primary);
	}
.button.is-secondary {
	background-color: var(--color-secondary);
	border-color: transparent;
	color: #000;
}
.button.is-secondary:hover {
	color: #fff;
}
.button:hover {
	background-image: linear-gradient(rgb(0 0 0/20%) 0 0);
}

.button.is-primary.help-icon-button {
	background-color: #444;
}
.navbar .button.is-light {
	background-color: var(--color-text-link);
}

.button.is-primary.is-hovered, .button.is-primary:hover {
/* background-color: var(--color-text-link); */
border-color: transparent;
color: #fff;
}

.steps:not(.is-hollow) .steps-marker:not(.is-hollow).is-primary {
	background-color: var(--color-text-primary) !important;
}
.steps.is-hollow .steps-marker.is-primary, .steps .steps-marker.is-hollow.is-primary {
border-color: #dbdbdb !important;
}
.steps-segment:after {
	background-color: var(--color-text-link);
}

/* =================================== */
/* Typography
/* =================================== */

body, button, input, optgroup, select, textarea {
font-family: 'Nexa-Regular', sans-serif !important;
font-weight: 300;
font-style: normal;
}

h1:not(.title) {
font-size: 2em;
margin-top: 4rem;
}
h2:not(.subtitle) {
font-size: 1.5em;
}
h3 {
font-size: 1.17em;
}
h4 {
font-size: 1em;
}
h5 {
font-size: 0.83em;
}
h6 {
font-size: 0.67em;
}

strong {
	font-family: 'Nexa-ExtraBold', sans-serif;
	font-weight: 500;
}

label {
	margin-bottom: 1.5rem !important;
}

/* =================================== */
/* Spacing
/* =================================== */

.control {
margin-top: 0.5rem;
}
fieldset {
	width: 60%;
}

  
/* =================================== */
/* kc styles
/* =================================== */

.help-icon-button {
	padding: 0 !important;
	height: 16px;
	margin-top: 5px;
}
h2 .help-icon-button {
	padding: 0 !important;
	height: 16px;
	margin-top: 12px;
}
.help-icon-button .help-icon {
	margin: 0 !important;
}


.hidden {
  display: none;
}

.next-btn {
	float: right;
	margin-top: 2rem;
}
.back-btn {
	float: left;
	margin-top: 2rem;
}
.create-btn {
	float: right;
	margin-top: 2rem;
}

.navbar-menu small {
	font-size: 0.6em;
	color: #aaa;
}
.datetimepicker-dummy .datetimepicker-dummy-wrapper {
	border-radius: 25px;
}

.datetimepicker.is-primary .datepicker-nav {
	background: #f868cd;
}
.datetimepicker.is-primary .datepicker-body .datepicker-dates .datepicker-days .datepicker-date .date-item.is-active {
	background: #03d1fd;
	border-color: #f868cd;
}
.datetimepicker.is-primary .datetimepicker-header .datetimepicker-selection-day {
	color: #f868cd;
}
.datetimepicker-dummy.is-primary .datetimepicker-dummy-wrapper.is-active, .datetimepicker-dummy.is-primary .datetimepicker-dummy-wrapper.is-focused, .datetimepicker-dummy.is-primary .datetimepicker-dummy-wrapper:active, .datetimepicker-dummy.is-primary .datetimepicker-dummy-wrapper:focus {
	border-color: #f868cd;
}
.datetimepicker-dummy.is-primary .datetimepicker-dummy-wrapper::before, .datetimepicker-dummy.is-primary .datetimepicker-dummy-wrapper:before, .datetimepicker-dummy.is-primary::before, .datetimepicker-dummy.is-primary:before {
	background-color: #f868cd;
}
.datetimepicker-dummy.is-primary .datetimepicker-clear-button {
	color: #f868cd;
}
.datetimepicker.is-primary .datepicker-body .datepicker-dates .datepicker-days .datepicker-date .date-item:hover {
	border-color: #f868cd;
}
button.datetimepicker-footer-validate {
	color: #fff !important;
	background-color: #03c98d !important;
	font-weight: 600;
	margin-bottom: 0.4rem;
	text-transform: uppercase;
}
.datetimepicker.is-datetimepicker-default .datetimepicker-container:after {
	border-bottom-color: #f868cd !important;
}
.datetimepicker-footer .button.is-small {
	margin-bottom: 0.4rem;
}

butoon.has-text-warning {
	color: #07d0fb !important;
}
.datetimepicker.is-primary .timepicker-input, .datetimepicker.is-primary .timepicker-input-number, .datetimepicker.is-primary .timepicker-time-divider {
	color: #f868cd!important;
}
.datetimepicker-selection-day:has(--) {
	display: none;
}

.checkbox:hover, .radio:hover {
	color: #fff !important;
}
.control label {
	margin-bottom: 0rem !important;
}

form h3 {
	font-size: 1.17em;
	margin: 2rem 0 1rem 0;
	color: #05d2fd;
}
.checkbox-group {
	margin-bottom: 2rem;
}
.is-checkradio[type=checkbox]+label::after, .is-checkradio[type=checkbox]+label:after {
	border-color: #f868cd;
}
.is-checkradio[type=checkbox]:hover:not([disabled])+label::before, .is-checkradio[type=checkbox]:hover:not([disabled])+label:before, .is-checkradio[type=radio]:hover:not([disabled])+label::before, .is-checkradio[type=radio]:hover:not([disabled])+label:before {
	border-color: #f868cd!important;
}
.is-checkradio[type=radio]+label::after, .is-checkradio[type=radio]+label:after {
	background: #f868cd;
}

legend {
	margin-bottom: 2rem;
}
.field:not(:last-child) {
	margin-bottom: 1.75rem;
}

.dash-panel .datetimepicker-dummy .datetimepicker-dummy-wrapper {
	background-color: transparent !important;
	border-color: transparent !important;
	color: #fff !important;
}
	.dash-panel .datetimepicker-dummy .datetimepicker-dummy-wrapper.is-hovered, .dash-panel .datetimepicker-dummy .datetimepicker-dummy-wrapper:hover {
		border-color: transparent !important;
	}
	.dash-panel .datetimepicker-dummy .datetimepicker-dummy-wrapper .datetimepicker-dummy-input {
		color: #fff !important;
	}
	
	.start-end {
		margin-bottom: 0rem !important;
	}
	.start-end label {
		margin-bottom: 0rem !important;
		margin-top: 1rem;
		width: 3rem;
	}
	.start-end .control {
		width: 70%;
	}
	
	.dash-panel .field-label .label {
		color: #fff !important;
		font-weight: 500;
		margin-bottom: 0rem !important;
		margin-top: 0.6rem;
		width: 6rem;
		text-align: left;
	}
	
	.column-1 h2 {
		font-family: 'Nexa-Bold', sans-serif !important;
		font-weight: 600;
		color: var(--color-primary);
	}
	.column-1 h2+p {
		color: var(--color-secondary);
	}
	.column-1 p {
		padding: 0.3rem 0;
	}
	.column-1 em {
		font-size: 0.8em;
	}
	
.column-3 label {
		width: 13rem !important;
		display: inline-block !important;
	}
	.column-3 .field-label {
		width: 10rem !important;
		display: inline-block !important;
	}

.column-3 .field:not(:last-child) {
		margin-bottom: 0.75rem;
	}	
	
	input[type=range].slider:not([orient=vertical]).has-output-tooltip+output, input[type=range].slider:not([orient=vertical]).has-output+output{
		background: var(--color-primary);
	}
		input[type=range].slider:not([orient=vertical]).has-output-tooltip+output {
			position: absolute;
			left: 0;
			top: -0.5rem;
		}
	.campaign_imagination input[type=range].slider:not([orient=vertical]).has-output {
		display: inline-block;
		vertical-align: middle;
		width: calc(50% - (4.2rem));
	}	
	
	[data-tooltip]:not(.is-loading).has-tooltip-multiline::before, [data-tooltip]:not(.is-disabled).has-tooltip-multiline::before, [data-tooltip]:not([disabled]).has-tooltip-multiline::before {
		width: 7rem;
		max-width: 15rem;
	}
	
	.chart-box {
		border-radius: .375em;
		padding: 1.25rem;
		position: relative;
		text-align: center;
		
	}
	
	#chart-1 .column tbody tr:nth-of-type(3n + 1) td, #chart-2 .column tbody tr:nth-of-type(3n + 1) td, #chart-3 .column tbody tr:nth-of-type(3n + 1) td, #chart-4 .column tbody tr:nth-of-type(3n + 1) td {
	  background-color: #f868cd !important;
	}
	#chart-1 .column tbody tr:nth-of-type(3n + 2) td, #chart-2 .column tbody tr:nth-of-type(3n + 2) td, #chart-3 .column tbody tr:nth-of-type(3n + 2) td, #chart-4 .column tbody tr:nth-of-type(3n + 2) td {
	  background-color: #05d2fd !important;
	}
	#chart-1 .column tbody tr:nth-of-type(3n + 3) td, #chart-2 .column tbody tr:nth-of-type(3n + 3) td, #chart-3 .column tbody tr:nth-of-type(3n + 3) td, #chart-4 .column tbody tr:nth-of-type(3n + 3) td {
	  background-color: #48c68d !important;
	}
	#chart-1 .column tbody tr:nth-of-type(3n + 4) td, #chart-2 .column tbody tr:nth-of-type(3n + 4) td, #chart-3 .column tbody tr:nth-of-type(3n + 4) td, #chart-4 .column tbody tr:nth-of-type(3n + 4) td {
	  background-color: #ffdd57 !important;
	}
	.charts-css.show-labels tbody tr th {
		color: #aaa;
		font-size: 0.7em;
		font-family: 'Nexa-Regular', sans-serif !important;
		font-weight: 300;
	}
	#chart-2 .line tbody tr td:nth-of-type(10n+1)::before {
		background: #f868cd !important;
	}
	#chart-3 .line tbody tr td:nth-of-type(10n+1)::before {
		background: #05d2fd !important;
	}
	
	body {
		display: flex;
		min-height: 100vh;
		flex-direction: column;
	  }
	
	  #wrapper {
		flex: 1;
	  }
	  
	  .btn-login:hover {
		  color: #fff !important;
	  }
	  
	  .quickview-header .title {
		  font-size: 1.2rem;
		  color: #000 !important;
	  }
	  
	  /* .modal .box {
		  background: #fff !important;
		  color: #353434 !important;
	  } */
	  .modal .box strong {
		  color: #fff !important;
	  }
	  .modal .box ul {
		list-style: none;
		padding: 0;
		margin: 0;
		margin-bottom: 1rem;
		margin-top: 1rem;
		margin-left: 15px;
	  }
	  
	  .modal .box ul li {
		padding-left: 15px;
		text-indent: -15px;
	  }
	  
	  .modal .box ul li:before {
		content: "\2022";
		margin-right: 10px;
		color: #f868cd;
		font-size: 1rem;
		position: relative;
		bottom: 0px;
	  }
	  .modal .box ul li ul li:before {
		  content: "\2022";
		  margin-right: 10px;
		  color: #fff;
		  font-size: 1rem;
		  position: relative;
		  bottom: 0px;
		}
	  
	  .navbar a.navbar-item:hover,
	  .navbar .navbar-link:hover {
		  background-color: transparent;
		  color: #f868cd !important;
	  }
	  .navbar.is-fixed-top {
		  box-shadow: 0px 0px 20px #0000005c;
	  }
	  
	  .tabs.is-toggle li.is-active a {
		  background-color: #f868cd;
		  border-color: #f868cd;
		  color: #000;
	  }
	  .tabs.is-toggle a {
		  border-color: #464c5a;
		  background-color: #292f3a;
	  }
	  
	  .hidden {
		  display: none;
	  }
	  
	  .input:focus, .input:focus-within, .is-focused.input, .is-focused.textarea, .select select.is-focused, .select select:focus, .select select:focus-within, .textarea:focus, .textarea:focus-within {
		  border-color: hsl(197.22deg 100% 63%);
	  }
	  
	  input[type="search"]::-webkit-search-cancel-button {
		 background-color: #fff;  
		 display: none;
	  }
	  .control.has-icons-right .input:focus~.icon {
		  color: #fff;
	  }
	  

	#user-ideas-box, #user-keyword-box {
		  margin-top: 0.6rem;
		  display: none;
	  }
	  .add-article-ideas-form, .add-keywords-form {
		  margin-bottom: 3rem;
	  }
	  
	  #counter-badges {
		  position: sticky;
		  top: 0;
		  z-index: 9999;
		  background: #fff;
		  padding: 1rem 0 1.5rem 0;
		  width: 110%;
	  }
	  
	  .dash-btn-col .control, .dash-btn-col .field {
		  width: 60%;
	  }
	  
	  .tag-offset {
		  /* position: absolute;
		  top: -15px;
		  left: -20px; */
		  margin-bottom: 0 !important;
		  border-radius: 1rem !important;
		  border-bottom-left-radius: 0 !important;
		  /* border-top-right-radius: 0 !important; */
		  border-bottom-right-radius: 0 !important;
	  }
	  
	  .dash-panel {
		  margin-bottom: 3rem;
	  }
	  
	  #archive-campaign.button:hover, #archive-campaign-check.button:hover {
		  color: #fff;
	  }
	  
	  @keyframes sway  {
		  0% { transform: rotate(8deg); }
		  50% { transform: rotate(-8deg); }
		  100% { transform: rotate(8deg); }
	  }
	  .sway-anim {
		  animation: sway 2.4s infinite;
			animation-timing-function: ease-in-out;
			-webkit-transform-origin: top;
			-moz-transform-origin: top;
			transform-origin: top;
	  }
	  
	  @keyframes flash {
		0% {
		  opacity: 1;
		}
	  
		50% {
		  opacity: 0;
		}
		
		
		100% {
		  opacity: 1;
		}
	  }
	  .flash-anim {
		animation: flash 2.4s linear infinite;
	}
	
	#dash-notifications p {
		font-size: 0.8em;
	}
	
	/* .modal-background {
		background-color: hsl(0deg 0% 74.56% / 86%) !important;
	} */
	.modal-background {
		background-color: rgba(5,5,5,0.96) !important;
	}
	.modal-card-head {
		background-color: rgb(20,22,26) !important;
		box-shadow: 0px 6px 13px #00000070;
	}
	.modal-card-body {
		background-color: rgb(20,22,26) !important;
	}
	.modal-card-foot {
		background-color: rgb(24,27,32) !important;
	}
	.modal-card-title {
		font-size: 18px !important;
	}
	
	.box {
		background-color: #14161a !important;
		color: #fff !important;
	}
	
	.ui-autocomplete {
	  position: absolute;
	  top: 100%;
	  left: 0;
	  z-index: 1000;
	  display: none;
	  float: left;
	  min-width: 160px;
	  padding: 15px 0;
	  margin: 2px 0 0;
	  list-style: none;
	  font-size: 14px;
	  text-align: left;
	  background-color: #14161a;
	  border: 1px solid #cccccc;
	  border: 1px solid rgba(0, 0, 0, 0.15);
	  border-radius: 20px;
	  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.475);
	  background-clip: padding-box;
	}
	
	.ui-autocomplete > li > div {
	  display: block;
	  padding: 3px 20px;
	  clear: both;
	  font-weight: normal;
	  line-height: 1.42857143;
	  color: #fff;
	  white-space: nowrap;
	}
	
	.ui-state-hover,
	.ui-state-active,
	.ui-state-focus {
	  text-decoration: none;
	  color: #f868cd !important;
	  /* background-color: #1f2228; */
	  cursor: pointer;
	}
	
	.ui-helper-hidden-accessible {
	  border: 0;
	  clip: rect(0 0 0 0);
	  height: 1px;
	  margin: -1px;
	  overflow: hidden;
	  padding: 0;
	  position: absolute;
	  width: 1px;
	}
	
	.column.notification-bar {
		margin-left: -1.7rem;
		margin-bottom: -1.7rem;
		width: calc(100% + 2* 1.71rem);
		
	}
	.column.notification-bar .notification {
		border-radius: 0px;
		border-bottom-left-radius: 1rem;
		border-bottom-right-radius: 1rem; 
		background-color: hsl(228deg 14.63% 10.14%);
		margin-top: 0.5rem;
	}
	.column.header-bar {
		margin-left: -1.7rem;
		margin-top: -1.7rem;
		width: calc(100% + 2* 1.71rem);
		
	}
	.column.header-bar .notification {
		border-radius: 0px;
		border-top-left-radius: 1rem;
		border-top-right-radius: 1rem; 
		background-color: hsl(228deg 14.63% 10.14%);
		padding-top: 0;
		padding-bottom: 0;
		padding-left: 0;
	}
	.column.header-bar .notification .tag-offset {
		/* width: calc(100% + 2* 0.75rem); */
		/* margin-bottom: 0 !important; */
		border-radius: 1rem !important;
		/* border-bottom-left-radius: 0 !important; */
		/* border-top-right-radius: 0 !important; */
		/* border-bottom-right-radius: 0 !important; */
		justify-content: left;
		margin: 0.5rem !important;
		padding: 1rem;
	}
	  
	  #showarchived .column.header-bar {
		  margin-left: 0;
		  margin-top: -1.76rem;
		  width: calc(100% + 2* 1.71rem);
	  }
	  #showarchived .column.header-bar  .tag-offset {
		  padding: 1rem;
		  /* padding-left: 1.5rem; */
		 font-weight: bold;
	  }
	  
	  table.dataTable {
		  width: 100% !important;
		  min-width: 100% !important;
	  }
	  
	  td.date-added, #activeKeywordsTable td:nth-child(8) {
		  font-size: 0.7em;
	  }
	
	.dash-panel .button.is-small {
		--bulma-control-size: 0.85rem;
		--bulma-control-radius: 0.5rem;
	}
	
	.datetimepicker.is-active {
		z-index: 999;
	}
	
	#campaignForm .field {
		padding: 1rem;
		background: #262b35;
		border-radius: 1rem;
	}
	#campaignForm .field .field {
		padding: 0rem;
		background: transparent;
		border-radius: 0rem;
	}
	#campaignForm label {
		margin-bottom: 1.0rem !important;
		padding-bottom: 0.2rem;
		border-bottom: 1px solid #444b5a;
		width: 99%;
		display: block;
		border-radius: 0;
	}
	.is-grouped-multiline .control label, .field .control label  {
		border-bottom: 0px none #444b5a !important;
		width: auto !important;
		display: inline !important;
	}
	.extra-fields {
		display: none;
	}
	
	.account-dropdown a {
		color: #fff !important;
	}
	.account-dropdown a:hover {
		color: var(--color-primary) !important;
	}
	a.account-name {
		color: #aaa !important;
	}
	
	#wp-card {
		width: 75%;
		margin: auto;
		margin-top: 6rem !important;
		padding: 2rem;
	}
	#wp-card .card-content {
		
		padding-bottom: 2rem;
	}
	#wp-card .card-footer {
		padding-top: 2rem;
		text-align: center;
	}
	#wp-card .card-title {
		color: #fff;
		padding-bottom: 3rem;
	}
	#wp-card .icon-text .step-text {
		color: #fff;
		font-size: 1.1em;
		font-weight: 400;
	}
	#wp-card .icon-text i {
		color: var(--color-primary);
	}
	#wp-card  p.block {
		color: #fff;
	}
	
	.customTooltip * {
	  color: #030303;
	 
	  font-family: var(--font-family-default) !important;
	}
	 
	.customTooltip .introjs-tooltip-title {
	  color: #000;
	  font-size: 22px !important;
	  font-family: var(--font-family-default);
	}
	.introjs-tooltipbuttons .button {
		color: #030303 !important;
	}
	.introjs-tooltipbuttons .button:hover {
		color: #fff !important;
	}
	
	/* =================================== */
	/* basic html styles for preview article pages
	/* =================================== */
	
	#article_page_content ul, #quickview_preview_article_content ul {
	  list-style: none;
	  padding: 0;
	  margin: 0;
	  margin-bottom: 2rem;
	}
	
	#article_page_content ul li, #quickview_preview_article_content ul li {
	  padding-left: 15px;
	}
	
	#article_page_content ul li:before, #quickview_preview_article_content ul li:before {
	  content: "\2022";
	  margin-right: 10px;
	  color: #000;
	  font-size: 2rem;
	  position: relative;
	  bottom: -4px;
	}
	
	#article_page_content p, div#quickview_preview_article_content p {
		margin: 1rem 0;
	}
	#article_page_content h2, #quickview_preview_article_content h2 {
		font-weight: bold;
		font-size: 1.6em;
	}
	#article_page_content h3, #quickview_preview_article_content h3 {
		font-weight: bold;
		font-size: 1.3em;
	}
	#article_page_content em, #quickview_preview_article_content em {
		font-style: italic;
	}
	
	#quickview_preview_article_content blockquote, #article_page_content blockquote {
		background-color: #f0f0f0;
		border-left: 5px solid #ccc;
		padding: 25px;
		margin: 40px 40px;
		font-style: italic;
		color: #333;
		font-size: 1.2em;
		font-weight: 600;
	}
	
	/* =================================== */
	
	.navbar-dropdown {
	background-color: rgb(20,22,26) !important;
	}
	.navbar-dropdown a.navbar-item:not(.is-active,.is-selected) {
		background-color: rgb(20,22,26) !important;
	}
	
	.is-active .navbar-dropdown a.navbar-item {
		background-color: #2e333d !important;
	}
	.is-active .navbar-dropdown {
		background-color: rgb(46,51,61) !important;
	}
	
	.card {
		background-color: rgb(20,22,26) !important;
	}
	
	.help-icon-button {
		background-image: linear-gradient(rgb(0 0 0 / 0%) 0 0) !important;
		border: none;
		background: transparent;
		box-shadow: 0 0 0 transparent;
	}
	.help-icon-button:hover {
		background-image: linear-gradient(rgb(0 0 0 / 0%) 0 0) !important;
		border: none;
	}
	.help-icon-button:hover i.fa-duotone:after {
		color: var(--color-secondary);
	}
	
	@media screen and (min-width: 1407px) {
		.is-display-none-fullhd-only, .is-hidden-fullhd-only {
			display: none !important;
		}
	}
	
	.select:not(.is-multiple):not(.is-loading):after {
		border-color:  #f868cd !important;
	}
	
	footer.footer {
		padding: 2rem 1.5rem 2rem !important;
	}
	footer.footer .menu {
		margin-top: 1.5rem;
	}
	#paypal-card {
		width: 45%;
		margin: 4rem auto 6rem auto;
	}
	
	.menu-list .menu-item, .menu-list a, .menu-list button {
		background-color: transparent !important;
		padding-left: 0;
	}
	
	.dataTables_wrapper thead label {
		color: #000 !important;
	}
	#activeKeywordsTable th, #ideasTable th {
		/* border: 1px solid #ddd; */
		padding: 8px;
		color: #000 !important;
		text-align: center !important;
	}
	
	#guide-content .box {
		padding: 2rem;
		background-color: #202229 !important;
		box-shadow: 0px 0px 0px #000;
	}
	#guide-content .box p {
		padding: 0.5rem 0;
	}
	#guide-content blockquote, #registrationForm blockquote {
		background-color: #fee799;
		border-left: 5px solid #fac002;
		padding: 1.5rem;
		margin: 2rem 20% 3rem 10%;
		font-style: italic;
		color: #333;
		text-align: left;
		box-sizing: border-box;
		border-radius: 1rem;
		box-shadow: 0px 5px 17px #00000075;
		
	}
	#guide-content blockquote strong {
		color: #000000; /* Black text */
		font-weight: bold; /* Bold font weight */
	}
			
	#guide-content h2 {
		color: var(--color-secondary); 
	}
	#guide-content h3 {
		color: var(--color-secondary); 
		margin-top: 1rem;
	}
	#guide-content ol > li {
		color: #FF69B4; /* Bright Pink */
	}
	
	/* Styling for nested <ul> within <ol> */
	#guide-content ol ul {
		list-style-type: disc; /* Standard bullet style */
		padding-left: 30px; /* Padding to ensure bullets are visible */
		border-left: none; /* Remove left border if any */
	}
	
	/* Styling for nested <li> within <ul> inside <ol> */
	#guide-content ol ul li {
		color: #fff; /* White color for nested list items */
	}
	
			
	#guide-content ul {
		padding: 15px 15px 15px 10px; /* Extra padding-left for bullets */
		margin-bottom: 1rem;
		font-size: 1.0em; /* Slightly larger font size for emphasis */
		list-style-type: disc; /* Ensure bullets are displayed */
		list-style-position: outside; /* Position bullets outside the padding */
	}
	
	/* Styling for Ordered Lists (<ol>) */
	#guide-content ol {
		color: #FF69B4;
		padding: 15px 15px 15px 10px; /* Extra padding-left for numbers */
		margin-bottom: 1rem;
		color: #fff; /* Darker text for contrast */
		font-size: 1.0em; /* Slightly larger font size for emphasis */
		list-style-position: outside; /* Position numbers outside the padding */
	}
	
	/* Styling for List Items (<li>) */
	#guide-content ul li, #guide-content ol li {
		margin-bottom: 5px; /* Space between list items */
		margin-top: 15px;
		word-wrap : break-word;
	}
	
	#guide-content ul, #guide-content ul li ul, #guide-content ol ul {
	  list-style: none;
	}
	
	#guide-content ul li {
	  padding-left: 1em; 
	  text-indent: -.7em;
	}
	
	#guide-content ul li::before {
	  content: "• ";
	  color: #FF69B4;
	}
	#guide-content ul li ul li::before {
	  content: "• ";
	  color: #fff;
	}
	
	/* =================================== */
	/* Responsive styles
	/* =================================== */
	  
	  @media screen and (max-width: 769px) {
		  .quickview {
			  width: 100%;
			  right: -100%;
			  max-width: calc(100% - 0px);
		  }
		  .column.notification-bar {
			  margin-top: 12rem;
		  }
		  .dash-content .control.is-pulled-right {
				float: left !important;
			}
			.dash-content .field.is-pulled-right {
				float: left !important;
			}
			#showarchived .column.header-bar {
				margin-left: -1.7rem;
				margin-top: -1.7rem;
				width: calc(100% + 2* 1.71rem);
			}
			#showarchived .column-3 {
				padding-left: 0.76rem !important;
			}
			#new-campiagn-btn {
				margin-top: 2rem;
				margin-bottom: 2rem;
			} 
			section .container .level.mt-4 {
				flex-direction: column-reverse;
			}
			#wrapper > section > .container {
				margin-top: 1.2rem !important;
			}
			#campaignForm fieldset {
				width: 100%;
			}
			.select-box-group {
				flex-flow: column;
			}
			.steps.is-horizontal:not(.is-thin).has-gaps .steps-segment:not(:last-child):after, .steps.is-horizontal:not(.is-thin) .steps-segment.has-gaps:not(:last-child):after {
				left: 2.0rem;
				right: 0.0rem;
			}
			#wp-card {
				width: 100%;
				margin: auto;
				margin-top: 4rem !important;
				padding: 1rem;
			}
			#paypal-card {
				width: 100%;
				margin: 4rem auto 6rem auto;
			}
			div.icon-text {
				display: flex;
				padding-bottom: 1.0rem;
				margin-bottom: 0.5rem;
				border-bottom: 1px solid #2d2d2d;
			}
			#google-form {
				width: 100% !important;
			}
			footer.footer .menu {
				margin-top: 1.5rem;
				display: none;
			}
	  }
	  @media screen and (min-width: 769px) {
			.quickview {
				width: 70%;
				right: -70%;
			}
			#showarchived .column.header-bar {
				margin-left: -1.7rem;
				margin-top: -1.7rem;
				width: calc(100% + 2* 1.71rem);
			}
			#campaignForm fieldset {
				width: 100%;
			}
			.steps.is-horizontal:not(.is-thin).has-gaps .steps-segment:not(:last-child):after, .steps.is-horizontal:not(.is-thin) .steps-segment.has-gaps:not(:last-child):after {
				left: 2.0rem;
				right: 0.0rem;
			}
		}
		@media screen and (min-width: 1088px) {
			  .quickview {
				  width: 70%;
				  right: -70%;
			  }
			  #showarchived .column.header-bar {
				  margin-left: 0;
					margin-top: -1.76rem;
					width: calc(100% + 2* 1.71rem);
			  }
			  #campaignForm fieldset {
				  width: 70%;
			  }
		  }
		  @media screen and (min-width: 1280px) {
				.quickview {
					width: 70%;
					right: -70%;
				}
			}
	  @media screen and (min-width: 1472px) {
		  .quickview {
			  width: 70%;
			  right: -70%;
		  }
	  }
	  
	 
	  