.hero-area{
	min-height:500px;
}
header .dropdown-menu{
	background: #0D1018;
}
header .drop-menu-item{
	color:white !important;
}
header .dropdown-menu{
	border:1px solid rgba(255,255,255,0.5);
	border-radius:10px;
}
.dropdown,.dropdown-toggle{
	outline:none !important;
}		
.w-400{
	width:400px;
} 
.btn-sm{
border-radius:5px;
}
.badge-pro-feature {
  background-image: linear-gradient(to right, #F8B400, #FFD700);
  color: #000;
  border: none;
  
}

.badge-pro-feature:hover {  
  background-image: linear-gradient(to right, #d4a340 0%, #c98932 100%);
  color: #fff;
}
a > .fa{
	width:28px;
}
.no-overflow {
	width:100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.drop-account-info{
	border-radius: 10px 10px 0 0 ;
	background:#cfcfcf;
	color:#000;
}
.drop-menu-item a:hover{
	color: rgb(144, 52, 189) ;
}
		
		
		
		


/* RESPONSE BOX */			
.responsebox-danger{
	border:1px solid var(--danger);
	padding:30px;
	font-size:16px;
}
.responsebox-danger > h3{
	color: var(--danger);
}

.responsebox-warning{
	border:1px solid var(--warning);
	padding:30px;
	font-size:16px;
}
.responsebox-warning > h3{
	color: var(--warning);
}

.responsebox-success{
	border:1px solid var(--success);
	padding:30px;
	font-size:16px;
}
.responsebox-success > h3{
	color: var(--success);
}

.responsebox-pro{
	border:1px solid #F5CE47;
	padding:30px;
	font-size:16px;
}
.responsebox-pro > h3{
	color: #F5CE47;
}

.responsebox-info{
	border:1px solid var(--info);
	padding:30px;
	font-size:16px;
}
.responsebox-info > h3{
	color: var(--info);
}
.responsebox-light{
	border:1px solid var(--light);
	padding:30px;
	font-size:16px;
}
.responsebox-light > h3{
	color: var(--light);
}

/* PRO BUTTONS */
.text-pro{
	color: #F5CE47;
}

.btn-pro:hover{
	background: transparent !important;
	color:#F5CE47;
	border:1px solid #F5CE47;
}
.btn-pro{
	background: #F5CE47 !important;
	color:black;
	border:1px solid #F5CE47;
}


/* PROCESS LOADER */
#processor-loader {
  margin-top: 5%;
  width: 200px;
  transform-box: fill-box;
  transform-origin: center;
  border-radius: 50%;
  animation: rotateAnimationSlow 10s linear infinite; 
}
.processor-loader-shape2 {
  fill: #FFFFFF;
  filter: url(#glowEffect);
  transform: scale(0.5, 0.5);
}
.processor-loader-shape1 {
  fill: #E33E84;
  filter: url(#glowEffect);
  transform: scale(0.5, 0.5);
}
@keyframes rotateAnimationSlow {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}