@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400&family=Open+Sans:wght@300;400;500&family=Orbitron&family=Poppins:wght@300&family=Roboto:wght@300&display=swap');

:root {
	--primary-color: #007bff;
	--secondary-color: #6c757d;
	--success-color: #28a745;
	--danger-color: #dc3545;
	--warning-color: #ffc107;
	--info-color: #17a2b8;
	--light-color: #f8f9fa;
	--dark-color: #414850ff;
	--muted-color: #6c757d;
	--black-color: #000000;
	--black-50-color: #00000050;
	--purple-color: #9e0aab;
	--sideBar-width: 310px;
	--main-bg-color: #bbbcbb; /*4ed2fe30*/

	--primary-color-darker: color-mix(in srgb, #000000 25%, var(--primary-color));
	--secondary-color-darker: color-mix(in srgb, #000000 25%, var(--secondary-color));
	--success-color-darker: color-mix(in srgb, #000000 25%, var(--success-color));
	--danger-color-darker: color-mix(in srgb, #000000 25%, var(--danger-color));
	--warning-color-darker: color-mix(in srgb, #000000 25%, var(--warning-color));
	--info-color-darker: color-mix(in srgb, #000000 25%, var(--info-color));
	--light-color-darker: color-mix(in srgb, #000000 25%, var(--light-color));
	--dark-color-darker: color-mix(in srgb, #000000 25%, var(--primary-color));
	--muted-color-darker: color-mix(in srgb, #000000 25%, var(--muted-color));
	--black-color-darker: color-mix(in srgb, #000000 25%, var(--black-color));
	--purple-color-darker: color-mix(in srgb, #000000 25%, var(--purple-color));
	--black-50-color-darker: color-mix(in srgb, #000000 25%, var(--black-50-color));

	--primary-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--primary-color));
	--secondary-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--secondary-color));
	--success-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--success-color));
	--danger-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--danger-color));
	--warning-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--warning-color));
	--info-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--info-color));
	--light-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--light-color));
	--dark-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--primary-color));
	--muted-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--muted-color));
	--black-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--black-color));
	--purple-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--purple-color));
	--black-50-color-lighter: color-mix(in srgb, #FFFFFF 25%, var(--black-50-color));
	--black-50-color-lighter2: color-mix(in srgb, #FFFFFF 65%, var(--black-50-color));

}
#loginContainer {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
}
#submit1:hover {
	background: var(--primary-color-lighter) !important;
	border-color: var(--primary-color) !important;
	cursor: pointer;
}
#submit2:hover,#supportSubmit:hover,#ownedNot:hover,#renew:hover {
	background: var(--danger-color-lighter) !important;
	border-color: var(--danger-color) !important;
	cursor: pointer;
}

#submitWebinars:hover,#profileSubmit:hover {
	background: var(--primary-color-lighter) !important;
	border-color: var(--primary-color) !important;
	cursor: pointer;
}

#watchWebinars:hover,#newWebinar:hover,#owned:hover,.get-audits:hover {
	background: var(--success-color-lighter) !important;
	border-color: var(--success-color) !important;
	cursor: pointer;
}

#changeLogin:hover {
	background: var(--info-color-lighter) !important;
	border-color: var(--info-color) !important;
	cursor: pointer;
}

#getSupport:hover,#editWebinars:hover,#editProduct:hover {
	background: var(--secondary-color-lighter) !important;
	border-color: var(--secondary-color) !important;
	cursor: pointer;
}

.sendLoginButton:hover,#checkTcr:hover,#submitCcInfo:hover {
	background: var(--primary-color-lighter) !important;
	border-color: var(--primary-color) !important;
	cursor: pointer;
}
.getProductsButton:hover,#modalSave:hover,#modalSaveIntegration:hover,#modalDeleteIntegration:hover,.preview:hover,#deleteSubscriber:hover,.deleteAuditFinal:hover {
	background: var(--success-color-lighter) !important;
	border-color: var(--success-color) !important;
	cursor: pointer;
}
.markRefundedButton:hover,#modalClose:hover,#deleteWebinars:hover,#deleteProduct:hover,#supportSubmit2:hover,.zoomButton:hover,.deviceButton:hover,.showPhoneHover:hover,.showPinHover:hover {
	background: var(--danger-color-lighter) !important;
	border-color: var(--danger-color) !important;
	cursor: pointer;
}
.performAudit:hover, #submitCcPayment:hover {
	background: var(--danger-color-lighter) !important;
	border-color: var(--danger-color) !important;
	cursor: pointer;	
}
.enrollCampaign:hover, #submitCcPayment:hover {
    background: var(--success-color-lighter) !important;
    border-color: var(--success-color) !important;
    cursor: pointer;
}
.black-button {
	background: var(--dark-color);
	color: var(--light-color);
	border-color: #696969;
}
.black-button:hover {
	background: #696969;
	color: var(--light-color);
	border-color: var(--dark-color);
	cursor:pointer;
}
.icon-picker:hover {
	background:lime;
}
.icon-picker-selected {
	box-shadow: inset 0px -1px 11px lime !important;
	border: 2px solid lime !important;
}
.manageButton {
	
}
@media only screen and (max-width: 1400px) {
    .audit-button {
        display:block !important;
        width:100% !important;
    }
}
@media only screen and (max-width: 1350px) {
    .audit-button {
        display:block !important;
        width:150px !important;
    }
}
.font1 {
	font-family: 'Montserrat', sans-serif;
}
.font2 {
	font-family: Consolas, monaco, monospace;
}
.container, .card {
	width: 100%;
	font-family: 'Montserrat', sans-serif;
	margin: 0 auto;
}

.d-block {
	display: block !important;
}
.d-iblock {
	display: inline-block;
}

.w-n100 {
	width: 100%;
	box-sizing: border-box;
}
.w-n95 {
	width: 95%;
	margin-left: 2.5%;
	margin-right: 2.5%;
	box-sizing: border-box;
}
.w-n90 {
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
	box-sizing: border-box;
}
.w-n85 {
	width: 85%;
	margin-left: 7.5%;
	margin-right: 7.5%;
	box-sizing: border-box;
}
.w-n80 {
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	box-sizing: border-box;
}
.w-n75 {
	width: 75%;
	margin-left: 12.5%;
	margin-right: 12.5%;
	box-sizing: border-box;
}
.w-n50 {
	width: 50%;
	margin-left: 25%;
	margin-right: 25%;
	box-sizing: border-box;
}
.w-n20 {
	width: 20%;
	box-sizing: border-box;
}
.w-n14 {
	width: 14%;
	box-sizing: border-box;
}

@media only screen and (max-width: 1200px) {
	.w-n95, .w-n90, .w-n85, .w-n80, .w-n75, .w-n50 {
		width: 100%;
		margin-left: 0%;
		margin-right: 0%;
	}

}

#iconFooter {
	position: fixed;
	bottom:0px;
}

@media only screen and (max-height: 700px) {
	#iconFooter {
		position:relative !important;
	}

}

.b-n1 {
	border-width: 1px;
	border-style: solid;
}
.b-n2 {
	border-width: 2px;
	border-style: solid;
}
.b-n3 {
	border-width: 3px;
	border-style: solid;
}



/* COLORS */
.bg-main-color {
	background: var(--main-bg-color);
}

.c-purple {
	color: var(--purple-color);
}
.bg-purple {
	background: var(--purple-color);
}
.b-purple {
	border-color: var(--purple-color);
}

.c-purple-darker {
	color: var(--purple-color-darker);
}
.bg-purple-darker {
	background: var(--purple-color-darker);
}
.b-purple-darker {
	border-color: var(--purple-color-darker);
}

.c-purple-lighter {
	color: var(--purple-color-lighter);
}
.bg-purple-lighter {
	background: var(--purple-color-lighter);
}
.b-purple-lighter {
	border-color: var(--purple-color-lighter);
}

.c-primary {
	color: var(--primary-color);
}
.bg-primary {
	background: var(--primary-color);
}
.b-primary {
	border-color: var(--primary-color);
}


.c-primary-darker {
	color: var(--primary-color-darker);
}
.bg-primary-darker {
	background: var(--primary-color-darker);
}
.b-primary-darker {
	border-color: var(--primary-color-darker);
}


.c-primary-lighter {
	color: var(--primary-color-lighter);
}
.bg-primary-lighter {
	background: var(--primary-color-lighter);
}
.b-primary-lighter {
	border-color: var(--primary-color-lighter);
}


.c-secondary {
	color: var(--secondary-color);
}
.bg-secondary {
	background: var(--secondary-color);
}
.b-secondary {
	border-color: var(--secondary-color);
}



.c-secondary-darker {
	color: var(--secondary-color-darker);
}
.bg-secondary-darker {
	background: var(--secondary-color-darker);
}
.b-secondary-darker {
	border-color: var(--secondary-color-darker);
}


.c-secondary-lighter {
	color: var(--secondary-color-lighter);
}
.bg-secondary-lighter {
	background: var(--secondary-color-lighter);
}
.b-secondary-lighter {
	border-color: var(--secondary-color-lighter);
}


.c-success {
	color: var(--success-color);
}
.bg-success {
	background: var(--success-color);
}
.b-success {
	border-color: var(--success-color);
}


.c-success-darker {
	color: var(--success-color-darker);
}
.bg-success-darker {
	background: var(--success-color-darker);
}
.b-success-darker {
	border-color: var(--success-color-darker);
}


.c-success-lighter {
	color: var(--success-color-lighter);
}
.bg-success-lighter {
	background: var(--success-color-lighter);
}
.b-success-lighter {
	border-color: var(--success-color-lighter);
}



.c-danger {
	color: var(--danger-color);
}
.bg-danger {
	background: var(--danger-color);
}
.b-danger {
	border-color: var(--danger-color);
}



.c-danger-darker {
	color: var(--danger-color-darker);
}
.bg-danger-darker {
	background: var(--danger-color-darker);
}
.b-danger-darker {
	border-color: var(--danger-color-darker);
}


.c-danger-lighter {
	color: var(--danger-color-lighter);
}
.bg-danger-lighter {
	background: var(--danger-color-lighter);
}
.b-danger-lighter {
	border-color: var(--danger-color-lighter);
}



.c-warning {
	color: var(--warning-color);
}
.bg-warning {
	background: var(--warning-color);
}
.b-warning {
	border-color: var(--warning-color);
}



.c-warning-darker {
	color: var(--warning-color-darker);
}
.bg-warning-darker {
	background: var(--warning-color-darker);
}
.b-warning-darker {
	border-color: var(--warning-color-darker);
}

.get-embed {
	border-color: orange !important;
	background: #FFC600;
}
.get-embed:hover {
	background: var(--warning-color-lighter);
	border-color: var(--warning-color-darker);
	cursor:pointer;
}
.get-stats {
	border-color: #6485a9 !important;
	background: #93c7ff;
}
.get-stats:hover {
	background: #afd2f8 !important;
	border-color: #93c7ff !important;
	cursor: pointer;
}
.get-subscribers, .get-video {
	border-color: var(--primary-color);
	background: var(--primary-color-darker);
}
.get-subscribers:hover {
	background: var(--primary-color);
	border-color: var(--primary-color-darker);
	cursor: pointer;
}
.get-links {
	border-color: var(--purple-color);
	background: var(--purple-color-darker);
}
.get-links:hover {
	background: var(--purple-color);
	border-color: var(--purple-color-darker);
	cursor: pointer;
}
.get-audit {

}
.dcaSend:hover {
	background: var(--purple-color-lighter);
	border-color: var(--purple-color);
	cursor: pointer;
}
.get-audit:hover {
	background: var(--danger-color-lighter);
	border-color: var(--danger-color);
	cursor: pointer;
}
.expired-campaign:hover {
	background: var(--success-color-lighter);
	border-color: var(--success-color);
	cursor: pointer;
}

@media only screen and (max-width: 950px) {
	.data-block {
		display:block !important;
		float:none !important;
		margin-top:10px;
		border: 1px solid black;
		padding: 8px;
		border-radius: 8px;
		border-color: #ada9a9;
		background: #fcf9f9;
	}
	.manage-button {
		display:block !important;
		float:none !important;
		margin-top:10px;
		width:100% !important;
	}
	.manage-block > img:nth-child(1) {
		width:30% !important;
		height:auto;
		margin-left:35% !important;
	}
}

.c-warning-lighter {
	color: var(--warning-color-lighter);
}
.bg-warning-lighter {
	background: var(--warning-color-lighter);
}
.b-warning-lighter {
	border-color: var(--warning-color-lighter);
}


.c-info {
	color: var(--info-color);
}
.bg-info {
	background: var(--info-color);
}
.b-info {
	border-color: var(--info-color);
}



.c-info-darker {
	color: var(--info-color-darker);
}
.bg-info-darker {
	background: var(--info-color-darker);
}
.b-info-darker {
	border-color: var(--info-color-darker);
}


.c-info-lighter {
	color: var(--info-color-lighter);
}
.bg-info-lighter {
	background: var(--info-color-lighter);
}
.b-info-lighter {
	border-color: var(--info-color-lighter);
}




.c-light {
	color: var(--light-color);
}
.bg-light {
	background: var(--light-color);
}
.b-light {
	border-color: var(--light-color);
}




.c-light-darker {
	color: var(--light-color-darker);
}
.bg-light-darker {
	background: var(--light-color-darker);
}
.b-light-darker {
	border-color: var(--light-color-darker);
}


.c-light-lighter {
	color: var(--light-color-lighter);
}
.bg-light-lighter {
	background: var(--light-color-lighter);
}
.b-light-lighter {
	border-color: var(--light-color-lighter);
}



.c-dark {
	color: var(--dark-color);
}
.bg-dark {
	background: var(--dark-color);
}
.b-dark {
	border-color: var(--dark-color);
}



.c-dark-darker {
	color: var(--dark-color-darker);
}
.bg-dark-darker {
	background: var(--dark-color-darker);
}
.b-dark-darker {
	border-color: var(--dark-color-darker);
}


.c-dark-darker {
	color: var(--dark-color-darker);
}
.bg-dark-darker {
	background: var(--dark-color-darker);
}
.b-dark-darker {
	border-color: var(--dark-color-darker);
}



.c-muted {
	color: var(--muted-color);
}
.bg-muted {
	background: var(--muted-color);
}
.b-muted {
	border-color: var(--muted-color);
}



.c-muted-darker {
	color: var(--muted-color-darker);
}
.bg-muted-darker {
	background: var(--muted-color-darker);
}
.b-muted-darker {
	border-color: var(--muted-color-darker);
}


.c-muted-lighter {
	color: var(--muted-color-lighter);
}
.bg-muted-lighter {
	background: var(--muted-color-lighter);
}
.b-muted-lighter {
	border-color: var(--muted-color-lighter);
}



.c-black {
	color: var(--black-color);
}
.bg-black {
	background: var(--black-color);
}
.b-black {
	border-color: var(--black-color);
}



.c-black-darker {
	color: var(--black-color-darker);
}
.bg-black-darker {
	background: var(--black-color-darker);
}
.b-black-darker {
	border-color: var(--black-color-darker);
}


.c-black-lighter {
	color: var(--black-color-lighter);
}
.bg-black-lighter {
	background: var(--black-color-lighter);
}
.b-black-lighter {
	border-color: var(--black-color-lighter);
}


.c-black-50 {
	color: var(--black-50-color);
}
.bg-black-50 {
	background: var(--black-50-color);
}
.b-black-50 {
	border-color: var(--black-50-color);
}



.c-black-50-darker {
	color: var(--black-50-color-darker);
}
.bg-black-50-darker {
	background: var(--black-50-color-darker);
}
.b-black-50-darker {
	border-color: var(--black-50-color-darker);
}


.c-black-50-lighter {
	color: var(--black-50-color-lighter);
}
.bg-black-50-lighter {
	background: var(--black-50-color-lighter);
}
.b-black-50-lighter {
	border-color: var(--black-50-color-lighter);
}

.c-black-50-lighter2 {
	color: var(--black-50-color-lighter2);
}
.bg-black-50-lighter2 {
	background: var(--black-50-color-lighter2);
}
.b-black-50-lighter2 {
	border-color: var(--black-50-color-lighter2);
}


.row {
	width: 100%
}
.row:after {
	content: "";
	display: table;
	clear: both;
}
.column-1 {
	float: left;
	width: 100%;
	height: auto;
	box-sizing: border-box;
}
.column-2 {
	float: left;
	width: 50%;
	height: auto;
	box-sizing: border-box;
}
.column-3 {
	float: left;
	width: 33.33333%;
	height: auto;
	box-sizing: border-box;
}
.column-3-2 {
	float: left;
	width: 66.66666%;
	height: auto;
	box-sizing: border-box;
}
.column-4 {
	float: left;
	width: 25%;
	height: auto;
	box-sizing: border-box;
}
.column-5 {
	float: left;
	width: 20%;
	height: auto;
	box-sizing: border-box;
}
.column-6 {
	float: left;
	width: 16.66667%;
	height: auto;
	box-sizing: border-box;
}
.column-7 {
	float: left;
	width: 14.28571%;
	height: auto;
	box-sizing: border-box;
}
.column-8 {
	float: left;
	width: 12.5%;
	height: auto;
	box-sizing: border-box;
}
.column-9 {
	float: left;
	width: 11.11111%;
	height: auto;
	box-sizing: border-box;
}
.column-12 {
	float: left;
	width: 8.3333333%;
	height: auto;
	box-sizing: border-box;
}
.column-45 {
	float: left;
	width: 44%;
	height: auto;
	box-sizing: border-box;
}

@media only screen and (max-width: 768px) {
	.column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12 {
		width: 100%;
		float: none
	}

}

.r-1 {
	border-radius: 1px;
}
.r-2 {
	border-radius: 2px;
}
.r-3 {
	border-radius: 3px;
}
.r-4 {
	border-radius: 4px;
}
.r-5 {
	border-radius: 5px;
}
.r-6 {
	border-radius: 6px;
}
.r-7 {
	border-radius: 7px;
}
.r-8 {
	border-radius: 8px;
}
.r-9 {
	border-radius: 9px;
}
.r-10 {
	border-radius: 10px;
}


.m-top-n0 {
	margin-top: 0px !important;
}
.m-top-n1 {
	margin-top: 1px !important;
}
.m-top-n2 {
	margin-top: 2px !important;
}
.m-top-n3 {
	margin-top: 3px !important;
}
.m-top-n4 {
	margin-top: 4px !important;
}
.m-top-n5 {
	margin-top: 5px !important;
}
.m-top-n6 {
	margin-top: 6px !important;
}
.m-top-n7 {
	margin-top: 7px !important;
}
.m-top-n8 {
	margin-top: 8px !important;
}
.m-top-n9 {
	margin-top: 9px !important;
}
.m-top-n10 {
	margin-top: 10px !important;
}
.m-top-n11 {
	margin-top: 11px !important;
}
.m-top-n12 {
	margin-top: 12px !important;
}
.m-top-n13 {
	margin-top: 13px !important;
}
.m-top-n14 {
	margin-top: 14px !important;
}
.m-top-n15 {
	margin-top: 15px !important;
}
.m-top-n16 {
	margin-top: 16px !important;
}
.m-top-n17 {
	margin-top: 17px !important;
}
.m-top-n18 {
	margin-top: 18px !important;
}
.m-top-n19 {
	margin-top: 19px !important;
}
.m-top-n20 {
	margin-top: 20px !important;
}
.m-top-n30 {
	margin-top: 30px !important;
}
.m-top-n40 {
	margin-top: 40px !important;
}


.m-bottom-n0 {
	margin-bottom: 0px !important;
}
.m-bottom-n1 {
	margin-bottom: 1px !important;
}
.m-bottom-n2 {
	margin-bottom: 2px !important;
}
.m-bottom-n3 {
	margin-bottom: 3px !important;
}
.m-bottom-n4 {
	margin-bottom: 4px !important;
}
.m-bottom-n5 {
	margin-bottom: 5px !important;
}
.m-bottom-n6 {
	margin-bottom: 6px !important;
}
.m-bottom-n7 {
	margin-bottom: 7px !important;
}
.m-bottom-n8 {
	margin-bottom: 8px !important;
}
.m-bottom-n9 {
	margin-bottom: 9px !important;
}
.m-bottom-n10 {
	margin-bottom: 10px !important;
}
.m-bottom-n11 {
	margin-bottom: 11px !important;
}
.m-bottom-n12 {
	margin-bottom: 12px !important;
}
.m-bottom-n13 {
	margin-bottom: 13px !important;
}
.m-bottom-n14 {
	margin-bottom: 14px !important;
}
.m-bottom-n15 {
	margin-bottom: 15px !important;
}
.m-bottom-n16 {
	margin-bottom: 16px !important;
}
.m-bottom-n17 {
	margin-bottom: 17px !important;
}
.m-bottom-n18 {
	margin-bottom: 18px !important;
}
.m-bottom-n19 {
	margin-bottom: 19px !important;
}
.m-bottom-n20 {
	margin-bottom: 20px !important;
}
.m-bottom-n30 {
	margin-bottom: 30px !important;
}
.m-bottom-n40 {
	margin-bottom: 40px !important;
}


.m-left-n0 {
	margin-left: 0px !important;
}
.m-left-n1 {
	margin-left: 1px !important;
}
.m-left-n2 {
	margin-left: 2px !important;
}
.m-left-n3 {
	margin-left: 3px !important;
}
.m-left-n4 {
	margin-left: 4px !important;
}
.m-left-n5 {
	margin-left: 5px !important;
}
.m-left-n6 {
	margin-left: 6px !important;
}
.m-left-n7 {
	margin-left: 7px !important;
}
.m-left-n8 {
	margin-left: 8px !important;
}
.m-left-n9 {
	margin-left: 9px !important;
}
.m-left-n10 {
	margin-left: 10px !important;
}
.m-left-n11 {
	margin-left: 11px !important;
}
.m-left-n12 {
	margin-left: 12px !important;
}
.m-left-n13 {
	margin-left: 13px !important;
}
.m-left-n14 {
	margin-left: 14px !important;
}
.m-left-n15 {
	margin-left: 15px !important;
}
.m-left-n16 {
	margin-left: 16px !important;
}
.m-left-n17 {
	margin-left: 17px !important;
}
.m-left-n18 {
	margin-left: 18px !important;
}
.m-left-n19 {
	margin-left: 19px !important;
}
.m-left-n20 {
	margin-left: 20px !important;
}



.m-right-n0 {
	margin-right: 0px !important;
}
.m-right-n1 {
	margin-right: 1px !important;
}
.m-right-n2 {
	margin-right: 2px !important;
}
.m-right-n3 {
	margin-right: 3px !important;
}
.m-right-n4 {
	margin-right: 4px !important;
}
.m-right-n5 {
	margin-right: 5px !important;
}
.m-right-n6 {
	margin-right: 6px !important;
}
.m-right-n7 {
	margin-right: 7px !important;
}
.m-right-n8 {
	margin-right: 8px !important;
}
.m-right-n9 {
	margin-right: 9px !important;
}
.m-right-n10 {
	margin-right: 10px !important;
}
.m-right-n11 {
	margin-right: 11px !important;
}
.m-right-n12 {
	margin-right: 12px !important;
}
.m-right-n13 {
	margin-right: 13px !important;
}
.m-right-n14 {
	margin-right: 14px !important;
}
.m-right-n15 {
	margin-right: 15px !important;
}
.m-right-n16 {
	margin-right: 16px !important;
}
.m-right-n17 {
	margin-right: 17px !important;
}
.m-right-n18 {
	margin-right: 18px !important;
}
.m-right-n19 {
	margin-right: 19px !important;
}
.m-right-n20 {
	margin-right: 20px !important;
}




.m-n0 {
	margin: 0px;
}
.m-n1 {
	margin: 1px;
}
.m-n2 {
	margin: 2px;
}
.m-n3 {
	margin: 3px;
}
.m-n4 {
	margin: 4px;
}
.m-n5 {
	margin: 5px;
}
.m-n6 {
	margin: 6px;
}
.m-n7 {
	margin: 7px;
}
.m-n8 {
	margin: 8px;
}
.m-n9 {
	margin: 9px;
}
.m-n10 {
	margin: 10px;
}
.m-n11 {
	margin: 11px;
}
.m-n12 {
	margin: 12px;
}
.m-n13 {
	margin: 13px;
}
.m-n14 {
	margin: 14px;
}
.m-n15 {
	margin: 15px;
}
.m-n16 {
	margin: 16px;
}
.m-n17 {
	margin: 17px;
}
.m-n18 {
	margin: 18px;
}
.m-n19 {
	margin: 19px;
}
.m-n20 {
	margin: 20px;
}




.p-top-n0 {
	padding-top: 0px !important;
}
.p-top-n1 {
	padding-top: 1px !important;
}
.p-top-n2 {
	padding-top: 2px !important;
}
.p-top-n3 {
	padding-top: 3px !important;
}
.p-top-n4 {
	padding-top: 4px !important;
}
.p-top-n5 {
	padding-top: 5px !important;
}
.p-top-n6 {
	padding-top: 6px !important;
}
.p-top-n7 {
	padding-top: 7px !important;
}
.p-top-n8 {
	padding-top: 8px !important;
}
.p-top-n9 {
	padding-top: 9px !important;
}
.p-top-n10 {
	padding-top: 10px !important;
}
.p-top-n11 {
	padding-top: 11px !important;
}
.p-top-n12 {
	padding-top: 12px !important;
}
.p-top-n13 {
	padding-top: 13px !important;
}
.p-top-n14 {
	padding-top: 14px !important;
}
.p-top-n15 {
	padding-top: 15px !important;
}
.p-top-n16 {
	padding-top: 16px !important;
}
.p-top-n17 {
	padding-top: 17px !important;
}
.p-top-n18 {
	padding-top: 18px !important;
}
.p-top-n19 {
	padding-top: 19px !important;
}
.p-top-n20 {
	padding-top: 20px !important;
}



.p-bottom-n0 {
	padding-bottom: 0px !important;
}
.p-bottom-n1 {
	padding-bottom: 1px !important;
}
.p-bottom-n2 {
	padding-bottom: 2px !important;
}
.p-bottom-n3 {
	padding-bottom: 3px !important;
}
.p-bottom-n4 {
	padding-bottom: 4px !important;
}
.p-bottom-n5 {
	padding-bottom: 5px !important;
}
.p-bottom-n6 {
	padding-bottom: 6px !important;
}
.p-bottom-n7 {
	padding-bottom: 7px !important;
}
.p-bottom-n8 {
	padding-bottom: 8px !important;
}
.p-bottom-n9 {
	padding-bottom: 9px !important;
}
.p-bottom-n10 {
	padding-bottom: 10px !important;
}
.p-bottom-n11 {
	padding-bottom: 11px !important;
}
.p-bottom-n12 {
	padding-bottom: 12px !important;
}
.p-bottom-n13 {
	padding-bottom: 13px !important;
}
.p-bottom-n14 {
	padding-bottom: 14px !important;
}
.p-bottom-n15 {
	padding-bottom: 15px !important;
}
.p-bottom-n16 {
	padding-bottom: 16px !important;
}
.p-bottom-n17 {
	padding-bottom: 17px !important;
}
.p-bottom-n18 {
	padding-bottom: 18px !important;
}
.p-bottom-n19 {
	padding-bottom: 19px !important;
}
.p-bottom-n20 {
	padding-bottom: 20px !important;
}




.p-left-n0 {
	padding-left: 0px !important;
}
.p-left-n1 {
	padding-left: 1px !important;
}
.p-left-n2 {
	padding-left: 2px !important;
}
.p-left-n3 {
	padding-left: 3px !important;
}
.p-left-n4 {
	padding-left: 4px !important;
}
.p-left-n5 {
	padding-left: 5px !important;
}
.p-left-n6 {
	padding-left: 6px !important;
}
.p-left-n7 {
	padding-left: 7px !important;
}
.p-left-n8 {
	padding-left: 8px !important;
}
.p-left-n9 {
	padding-left: 9px !important;
}
.p-left-n10 {
	padding-left: 10px !important;
}
.p-left-n11 {
	padding-left: 11px !important;
}
.p-left-n12 {
	padding-left: 12px !important;
}
.p-left-n13 {
	padding-left: 13px !important;
}
.p-left-n14 {
	padding-left: 14px !important;
}
.p-left-n15 {
	padding-left: 15px !important;
}
.p-left-n16 {
	padding-left: 16px !important;
}
.p-left-n17 {
	padding-left: 17px !important;
}
.p-left-n18 {
	padding-left: 18px !important;
}
.p-left-n19 {
	padding-left: 19px !important;
}
.p-left-n20 {
	padding-left: 20px !important;
}




.p-right-n0 {
	padding-right: 0px !important;
}
.p-right-n1 {
	padding-right: 1px !important;
}
.p-right-n2 {
	padding-right: 2px !important;
}
.p-right-n3 {
	padding-right: 3px !important;
}
.p-right-n4 {
	padding-right: 4px !important;
}
.p-right-n5 {
	padding-right: 5px !important;
}
.p-right-n6 {
	padding-right: 6px !important;
}
.p-right-n7 {
	padding-right: 7px !important;
}
.p-right-n8 {
	padding-right: 8px !important;
}
.p-right-n9 {
	padding-right: 9px !important;
}
.p-right-n10 {
	padding-right: 10px !important;
}
.p-right-n11 {
	padding-right: 11px !important;
}
.p-right-n12 {
	padding-right: 12px !important;
}
.p-right-n13 {
	padding-right: 13px !important;
}
.p-right-n14 {
	padding-right: 14px !important;
}
.p-right-n15 {
	padding-right: 15px !important;
}
.p-right-n16 {
	padding-right: 16px !important;
}
.p-right-n17 {
	padding-right: 17px !important;
}
.p-right-n18 {
	padding-right: 18px !important;
}
.p-right-n19 {
	padding-right: 19px !important;
}
.p-right-n20 {
	padding-right: 20px !important;
}



.p-n0 {
	padding: 0px;
}
.p-n1 {
	padding: 1px;
}
.p-n2 {
	padding: 2px;
}
.p-n3 {
	padding: 3px;
}
.p-n4 {
	padding: 4px;
}
.p-n5 {
	padding: 5px;
}
.p-n6 {
	padding: 6px;
}
.p-n7 {
	padding: 7px;
}
.p-n8 {
	padding: 8px;
}
.p-n9 {
	padding: 9px;
}
.p-n10 {
	padding: 10px;
}
.p-n11 {
	padding: 11px;
}
.p-n12 {
	padding: 12px;
}
.p-n13 {
	padding: 13px;
}
.p-n14 {
	padding: 14px;
}
.p-n15 {
	padding: 15px;
}
.p-n16 {
	padding: 16px;
}
.p-n17 {
	padding: 17px;
}
.p-n18 {
	padding: 18px;
}
.p-n19 {
	padding: 19px;
}
.p-n20 {
	padding: 20px;
}


.fs-n7 {
	font-size: 7px
}
.fs-n8 {
	font-size: 8px
}
.fs-n9 {
	font-size: 9px
}
.fs-n10 {
	font-size: 10px
}
.fs-n11 {
	font-size: 11px
}
.fs-n12 {
	font-size: 12px
}
.fs-n13 {
	font-size: 13px
}
.fs-n14 {
	font-size: 14px
}
.fs-n15 {
	font-size: 15px
}
.fs-n16 {
	font-size: 16px
}
.fs-n17 {
	font-size: 17px
}
.fs-n18 {
	font-size: 18px
}
.fs-n19 {
	font-size: 19px
}
.fs-n20 {
	font-size: 20px
}
.fs-n21 {
	font-size: 21px
}
.fs-n22 {
	font-size: 22px
}
.fs-n23 {
	font-size: 23px
}
.fs-n24 {
	font-size: 24px
}
.fs-n25 {
	font-size: 25px
}
.fs-n26 {
	font-size: 26px
}
.fs-n27 {
	font-size: 27px
}
.fs-n28 {
	font-size: 28px
}
.fs-n29 {
	font-size: 29px
}
.fs-n30 {
	font-size: 30px
}
.fs-n50 {
	font-size: 50px
}

/* LINE HEIGHTS */
.lh-0-7 {
	line-height: 0.7;
}
.lh-0-8 {
	line-height: 0.8;
}
.lh-0-9 {
	line-height: 0.9;
}
.lh-1-0 {
	line-height: 1.0;
}
.lh-1-1 {
	line-height: 1.1;
}
.lh-1-2 {
	line-height: 1.2;
}
.lh-1-3 {
	line-height: 1.3;
}
.lh-1-4 {
	line-height: 1.4;
}



.a-center {
	text-align: center;
}
.a-left {
	text-align: left;
}
.a-right {
	text-align: right;
}



.s-n1 {
	text-shadow: 1px 1px 1px black;
}
.s-n2 {
	text-shadow: 1px 1px 2px black;
}
.s-n3 {
	text-shadow: 1px 1px 3px black;
}
.s-n4 {
	text-shadow: 1px 1px 4px black;
}
.s-n5 {
	text-shadow: 1px 1px 5px black;
}




.bs-n1 {
	box-shadow: 1px 1px 1px #BDBDBD;
}
.bs-n2 {
	box-shadow: 1px 1px 4px #BDBDBD;
}
.bs-n3 {
	box-shadow: 1px 1px 6px #BDBDBD;
}
.bs-n4 {
	box-shadow: 1px 1px 8px #BDBDBD;
}
.bs-n5 {
	box-shadow: 1px 1px 10px #BDBDBD;
}



/* FONT STYLES */
.fw-normal {
	font-weight: normal;
}
.fw-bold {
	font-weight: bold;
}
.fw-bolder {
	font-weight: bolder;
}
.fw-italic {
	font-style: italic;
}


.td-underline {
	text-decoration: underline;
}
.td-strike {
	text-decoration: line-through;
}

.c-pointer {
	cursor: pointer;
}

.right {
	float: right;
}
.left {
	float: left;
}

.bb {
	box-sizing: border-box;
}
#iconFooter {
	color:white;
}
#sideBar {
	position: fixed;
	left: 0px;
	top: 0px;
	width: var(--sideBar-width);
	height: 100vh;
	background: #343a40;
	color:white;
}

.sidbar-button {
	height: 50px;
	background: #343a40;
	width: 100%;
	display: block;
	line-height: 50px;
	box-sizing: border-box;
	color:white;
	-webkit-user-select: none; /* Safari */
	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */
}
.sidbar-button:hover {
	background: #e9e9e9;
	cursor: pointer;
	color:#343a40
}
.sidbar-button-active {
	background: #e9e9e9 !important;
	color:#343a40
}
table {
	border-collapse: collapse;
}
thead, tr, td, th {
	padding: 8.5px;
	font-size: 11px;
}
thead, th {
	height: 20px;
	background: #FFC600 !important;
}
/*tr:nth-child(even) {
	background: #e8e8e8ff;
	transition: transform .2s;
}
tr:nth-child(odd) {
	background: #fffffff;
	transition: transform .2s;
}*/
tr:nth-child(even):not(.odd):not(.even) {
	background: #e8e8e8ff;
	transition: transform .2s;
}

tr:nth-child(odd):not(.odd):not(.even) {
	background: #ffffff;
	transition: transform .2s;
}

tr:hover {
	background: #ffc60021;
	transform: scale(1.01);
	box-sizing: border-box;
	box-shadow:2px 2px 2px #cececeff
}
.modal {
	background: #00000075;
	height: 100vh;
	width: 100vw;
	position: fixed;
	z-index: 100;
	top: 0px;
	left: 0px;
	display: none;
}
.modal-body {
	height: auto;
	width: 60%;
	margin-left: 20%;
	background: white;
	padding: 20px;
	border-radius: 6px;
	margin-top: 10%;

	box-shadow: 5px 5px 10px #00000045;
}
.modal-header {
	font-size: 13px;
	font-weight: bold;
}
.header-title {
	font-size: 12px;
}
.modal-content {
	font-size: 12px;
	padding: 10px 0px 10px 0px;
}
.modal-footer {
	height: 30px;
}
.modal-close {
	position: absolute;
	top: -8px;
	right: -5px;
	font-size: 24px;
	cursor:pointer;
}
.break {
	border: 1px solid #e9e6e6;
	margin-bottom: 4px;
}
.helper {
	font-size: 11px;
	color: #b6b4b4
}
#tooltip {
	display: inline-block;
	position: absolute;
	/* z-index: 2; */
	/* top: -20px; */
	/* margin-right: auto; */
	box-sizing: border-box;
	background: #4dcef8;
	color: black;
	padding: 3px;
	border-radius: 5px;
	margin-top: -25px;
	width: 150px;
	text-align: center;
	margin-left: -140px;
	z-index:1
}
.triangle-isosceles {
	position: relative;
	padding: 15px;
	margin: 1em 0 3em;
	color: #000;
	background: #f3961c;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#f9d835), to(#f3961c));
	background: -moz-linear-gradient(#f9d835, #f3961c);
	background: -o-linear-gradient(#f9d835, #f3961c);
	background: linear-gradient(#f9d835, #f3961c);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#tooltip:after {
	content: "";
	position: absolute;
	bottom: -5px;
	border-width: 5px 5px 0;
	border-style: solid;
	border-color: #4dcef8 transparent;
	display: block;
	width: 0;
	right: 14px;
}
.d-none {
	display:none !important;
}
#watermark {
	/* the image you want to 'watermark' */
	/*height: 200px;  or whatever, equal to the image you want 'watermarked' */
	width: 10px; /* as above */
	/*background-image: url(images/vortxt-concepts-icon-watermark.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	position: relative;*/
}

#watermark img {
	/* the actual 'watermark' */
	position: absolute;
	bottom: 40px; /* or whatever */
	left: 50%; /* or whatever, position according to taste */
	opacity: 0.5; /* Firefox, Chrome, Safari, Opera, IE >= 9 (preview) */
	filter: alpha(opacity=50); /* for <= IE 8 */
	z-index:-1;
}
#sideBar > img {
	width: 60%;
	margin-left: 20%;
}
.txtriaSVG-white {
	fill:#FFFFFF;
}
.predelete {
	background:#ff8e8e !important;
}
@keyframes flash {
	0%, 50%, 100% {
		opacity: 1;
	}
	25%, 75% {
		opacity: 0;
	}
}
.flash {
	animation-name: flash;
}
.vertical-center {
	margin: 0;
	position: absolute;
	top: 50%;
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.make-default {
	cursor:pointer;
}
.api-item:hover {
	/*border:3px solid orange*/
	background:#FFC600;
	color:black
}
.campaignIdName:hover {
	text-decoration: underline !important;
	color:var(--primary-color);
	cursor:pointer;
	font-weight: bolder;
}
#uploadList {
	background:#e3e4e5;
}
@media only screen and (max-width: 875px) {
	#sideBar {
		display: none;
		left: unset;
		right: 0px;
		margin-left: 0%;
		margin-right: 0%;
		margin-top: 48px;
		width: 60%;
	}
	#sideBar > img {
		display: none;
		width: 60%;
	}
	#mobileTopBar {
		display: block !important;
		position: fixed;
		top: 0px;
	}
	#mainArea {
		width: 100% !important;
		margin-left: 0% !important;
		margin-top: 70px;
	}

}

@media only screen and (max-width: 1000px) {
    .audit-button {
        display: block !important;
    }
}

/* Webkit-based browsers (Chrome, Edge, Safari) */
.thin-scrollbar::-webkit-scrollbar {
	width: 6px; /* Adjust scrollbar width */
}

.thin-scrollbar::-webkit-scrollbar-thumb {
	background: #888; /* Thumb color */
	border-radius: 3px; /* Rounded corners */
}

.thin-scrollbar::-webkit-scrollbar-thumb:hover {
	background: #555; /* Thumb color on hover */
}

/* For Firefox */
.thin-scrollbar {
	scrollbar-width: thin; /* Thinner scrollbar */
	scrollbar-color: #888 #f1f1f1; /* Thumb and track colors */
}

.mobile-button {
    display: none;
}
@media (max-width: 767px) {
    .desktop-buttons {
        display: none;
    }
    .mobile-button {
        display: block;
    }
}

/* give a 3D context to the container */
.engagement {
    perspective: 1000px; /* controls depth — increase for subtler, decrease for stronger 3D */
    -webkit-perspective: 1000px;
}

/* target the image inside — smooth transition and good transform origin */
.engagement img {
    display: block;                /* remove inline gaps */
    max-width: 100%;
    height: auto;
    transform-origin: center;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition: transform 350ms cubic-bezier(.2,.9,.3,1), filter 350ms;
    will-change: transform;
}

/* hovered state: subtle 3D tilt + small scale */
.engagement:hover img {
    transform: rotateX(8deg) rotateY(-6deg) scale(1.03);
    box-shadow: 0 0 5px rgba(0, 170, 255, 0.95); /* glow highlight */
    /* optional visual polish */
    filter: saturate(1.03) contrast(1.02);
}

/* optional: make the tilt stronger when user holds pointer (active) */
.engagement:active img {
    transform: rotateX(12deg) rotateY(-10deg) scale(1.05);
    transition-duration: 160ms;
}

