.color-box{
	max-width: 1360px;
	margin: 0 auto;
}
.color-block{
	display: flex;
}

.color-block div{
	width: 100%;
	height: 100px;
	padding: 5px;
}

.demo{
	height: 200px;
	border: 1px solid !important;
	padding: 15px;
	margin: 15px 0px !important;
}




/* цвета релиона */
.releon {
	--color-stage:     	  	var(--white);
	--color-text-stage:  	var(--neutral-800);

	--color-back-stage: 	var(--neutral-100);		
	--color-border:     	var(--neutral-200);	
	--color-deep-stage:  	var(--neutral-300);
				
	--color-prime:      	var(--green-600);
	--color-second:     	var(--amber-300);
	--color-alert:       var(--rose-700);
}



.julia {
	--color-stage:     	  	#ffffff;
	--color-text-stage:  	#202020;

	--color-back-stage: 	var(--slate-100);

	--color-border:     	#ebebeb;	
	--color-deep-stage:  #838383;
			
	--color-prime:      	var(--teal-700); 

	--color-second:     	#3dc150;
	--color-alert:       #ef4444;
	
}




.extreme_j {
	--color-back-stage: 	var(--neutral-100);/* xxx по палитре на странице colors*/
	--color-deep-stage: 	var(--neutral-500);/* xxx по палитре на странице colors*/
	--color-prime:      	var(--neutral-800); /* xxx по палитре на странице colors*/
	--color-second:     	var(--yellow-300);/* xxx по палитре на странице colors*/
	--color-alert:       var(--red-600); /* xxx по палитре на странице colors*/

}



.extreme_n {
		--color-stage:     	#ffffff;
		--color-text-stage:  #292929;

		--color-back-stage: 	#EBEBEB;/* xxx по палитре грибко*/

		--color-border:     	#ebebeb;
		--color-deep-stage:  #878787;/* xxx по палитре грибко*/


		
		--color-prime:      	#292929; /* xxx по палитре грибко  "prime color = back-stage"  */
		
		
		--color-second:     	#FFD203; /* xxx по палитре грибко*/
		--color-alert:       #ef4a44; /* xxx по палитре грибко*/
}






.web_project_24 {
	--color-stage:     	#ffffff;
	--color-text-stage:  #292929;

	/* --color-back-stage: 	#ebebeb;
	--color-back-stage: 	#f0f2f5; */
	--color-back-stage: 	#ecf5fa;


	--color-border:     	#ebebeb;
	--color-deep-stage:  #878787;


	
	--color-prime:      	#003356; 

	--color-second:     		#fe6523; 
	--color-text-second:    #ebebeb;

	--color-alert:       #ef4a44;

	--color-success:     #44b035;
	
}















/* 
.gazprom {
	--color-stage:     	  		var(--white);
	--color-text-stage:  		var(--slate-800);

			--color-back-stage: 	var(--slate-100);		
			--color-border:     	var(--slate-200);	
			--color-deep-stage:  var(--slate-300);
				
	--color-prime:      		var(--sky-600);
	--color-second:     	  var(--amber-300);
	--color-alert:         var(--rose-700);
}



.gazprom-night {
	--color-stage:     	  		var(--slate-700);
	--color-text-stage:  		var(--slate-100);

			--color-back-stage: 	var(--slate-300);
			--color-border:     	var(--slate-800);	
			--color-deep-stage:  var(--slate-500);
					
	--color-prime:      	  var(--sky-600);
	--color-second:     	  var(--amber-300);
	--color-alert:         var(--rose-600);
} 
*/









/* html интерфейс */

.border{
	border: 1px solid var(--color-border) !important;
}


.stage, .stage input::placeholder, .stage input{
	background-color: var(--color-stage);
	color: var(--color-text-stage);
}




.back-stage{
	background-color: var(--color-back-stage);
	color: var(--color-text-stage);
}


.deep-stage{
	background-color: var(--color-deep-stage);
	color: var(--color-text-stage);
}


.prime {
	background-color: var(--color-prime);
	color: var(--color-back-stage);
}


.text-prime{
	color: var(--color-prime);
} 



.text-second, strong{
	color: var(--color-second);
} 


.second{
	background-color: var(--color-second);
	color: var(--color-text-second);
}

.alert{
	background-color: var(--color-alert);
	color: var(--color-back-stage);
	margin: unset;
}

.success{
	background-color: var(--color-success);
	color: var(--color-back-stage);
	margin: unset;
}



.text-alert{
	color: var(--color-alert);
} 

.text-success{
	color: var(--color-success);
} 


.text-stage{
	color: var(--color-stage);
} 

.text-deep-stage{
	color: var(--color-deep-stage);
} 






:root {
	--white: #ffffff;
	--black: black;
	color: var(--color-black);
}



/*========== Slate =========*/

 :root {
	--slate-50:  #f8fafc;
	--slate-100: #f1f5f9;
	--slate-200: #e2e8f0;
	--slate-300: #cbd5e1;
	--slate-400: #94a3b8;
	--slate-500: #64748b;
	--slate-600: #475569;
	--slate-700: #334155;
	--slate-800: #1e293b;
	--slate-900: #0f172a;
	--slate-950: #020617;
 }
 
 /* Фоновые цвета */
 .bg-slate-50  { background-color: var(--slate-50);  }
 .bg-slate-100 { background-color: var(--slate-100); }
 .bg-slate-200 { background-color: var(--slate-200); }
 .bg-slate-300 { background-color: var(--slate-300); }
 .bg-slate-400 { background-color: var(--slate-400); }
 .bg-slate-500 { background-color: var(--slate-500); }
 .bg-slate-600 { background-color: var(--slate-600); }
 .bg-slate-700 { background-color: var(--slate-700); }
 .bg-slate-800 { background-color: var(--slate-800); }
 .bg-slate-900 { background-color: var(--slate-900); }
 .bg-slate-950 { background-color: var(--slate-950); }
 
 /* Цвет текста */
 .text-slate-50  { color: var(--slate-50);  }
 .text-slate-100 { color: var(--slate-100); }
 .text-slate-200 { color: var(--slate-200); }
 .text-slate-300 { color: var(--slate-300); }
 .text-slate-400 { color: var(--slate-400); }
 .text-slate-500 { color: var(--slate-500); }
 .text-slate-600 { color: var(--slate-600); }
 .text-slate-700 { color: var(--slate-700); }
 .text-slate-800 { color: var(--slate-800); }
 .text-slate-900 { color: var(--slate-900); }
 .text-slate-950 { color: var(--slate-950); }
 
 /* Цвет рамки */
 .border-slate-50  { border-color: var(--slate-50);  }
 .border-slate-100 { border-color: var(--slate-100); }
 .border-slate-200 { border-color: var(--slate-200); }
 .border-slate-300 { border-color: var(--slate-300); }
 .border-slate-400 { border-color: var(--slate-400); }
 .border-slate-500 { border-color: var(--slate-500); }
 .border-slate-600 { border-color: var(--slate-600); }
 .border-slate-700 { border-color: var(--slate-700); }
 .border-slate-800 { border-color: var(--slate-800); }
 .border-slate-900 { border-color: var(--slate-900); }
 .border-slate-950 { border-color: var(--slate-950); }

 


/*========= Gray =========*/
:root {
	--gray-50:  #f9fafb;
	--gray-100: #f3f4f6;
	--gray-200: #e5e7eb;
	--gray-300: #d1d5db;
	--gray-400: #9ca3af;
	--gray-500: #6b7280;
	--gray-600: #4b5563;
	--gray-700: #374151;
	--gray-800: #1f2937;
	--gray-900: #111827;
	--gray-950: #030712;
 }
 
 /* Фоновые цвета */
 .bg-gray-50  { background-color: var(--gray-50);  }
 .bg-gray-100 { background-color: var(--gray-100); }
 .bg-gray-200 { background-color: var(--gray-200); }
 .bg-gray-300 { background-color: var(--gray-300); }
 .bg-gray-400 { background-color: var(--gray-400); }
 .bg-gray-500 { background-color: var(--gray-500); }
 .bg-gray-600 { background-color: var(--gray-600); }
 .bg-gray-700 { background-color: var(--gray-700); }
 .bg-gray-800 { background-color: var(--gray-800); }
 .bg-gray-900 { background-color: var(--gray-900); }
 .bg-gray-950 { background-color: var(--gray-950); }
 
 /* Цвет текста */
 .text-gray-50  { color: var(--gray-50);  }
 .text-gray-100 { color: var(--gray-100); }
 .text-gray-200 { color: var(--gray-200); }
 .text-gray-300 { color: var(--gray-300); }
 .text-gray-400 { color: var(--gray-400); }
 .text-gray-500 { color: var(--gray-500); }
 .text-gray-600 { color: var(--gray-600); }
 .text-gray-700 { color: var(--gray-700); }
 .text-gray-800 { color: var(--gray-800); }
 .text-gray-900 { color: var(--gray-900); }
 .text-gray-950 { color: var(--gray-950); }
 
 /* Цвет рамки */
 .border-gray-50  { border-color: var(--gray-50);  }
 .border-gray-100 { border-color: var(--gray-100); }
 .border-gray-200 { border-color: var(--gray-200); }
 .border-gray-300 { border-color: var(--gray-300); }
 .border-gray-400 { border-color: var(--gray-400); }
 .border-gray-500 { border-color: var(--gray-500); }
 .border-gray-600 { border-color: var(--gray-600); }
 .border-gray-700 { border-color: var(--gray-700); }
 .border-gray-800 { border-color: var(--gray-800); }
 .border-gray-900 { border-color: var(--gray-900); }
 .border-gray-950 { border-color: var(--gray-950); }




 /* ======= Zinc =======*/
 :root {
	--zinc-50:  #fafafa;
	--zinc-100: #f4f4f5;
	--zinc-200: #e4e4e7;
	--zinc-300: #d4d4d8;
	--zinc-400: #a1a1aa;
	--zinc-500: #71717a;
	--zinc-600: #52525b;
	--zinc-700: #3f3f46;
	--zinc-800: #27272a;
	--zinc-900: #18181b;
	--zinc-950: #09090b;
 }
 
 /* Фоновые цвета */
 .bg-zinc-50  { background-color: var(--zinc-50);  }
 .bg-zinc-100 { background-color: var(--zinc-100); }
 .bg-zinc-200 { background-color: var(--zinc-200); }
 .bg-zinc-300 { background-color: var(--zinc-300); }
 .bg-zinc-400 { background-color: var(--zinc-400); }
 .bg-zinc-500 { background-color: var(--zinc-500); }
 .bg-zinc-600 { background-color: var(--zinc-600); }
 .bg-zinc-700 { background-color: var(--zinc-700); }
 .bg-zinc-800 { background-color: var(--zinc-800); }
 .bg-zinc-900 { background-color: var(--zinc-900); }
 .bg-zinc-950 { background-color: var(--zinc-950); }
 
 /* Цвет текста */
 .text-zinc-50  { color: var(--zinc-50);  }
 .text-zinc-100 { color: var(--zinc-100); }
 .text-zinc-200 { color: var(--zinc-200); }
 .text-zinc-300 { color: var(--zinc-300); }
 .text-zinc-400 { color: var(--zinc-400); }
 .text-zinc-500 { color: var(--zinc-500); }
 .text-zinc-600 { color: var(--zinc-600); }
 .text-zinc-700 { color: var(--zinc-700); }
 .text-zinc-800 { color: var(--zinc-800); }
 .text-zinc-900 { color: var(--zinc-900); }
 .text-zinc-950 { color: var(--zinc-950); }
 
 /* Цвет рамки */
 .border-zinc-50  { border-color: var(--zinc-50);  }
 .border-zinc-100 { border-color: var(--zinc-100); }
 .border-zinc-200 { border-color: var(--zinc-200); }
 .border-zinc-300 { border-color: var(--zinc-300); }
 .border-zinc-400 { border-color: var(--zinc-400); }
 .border-zinc-500 { border-color: var(--zinc-500); }
 .border-zinc-600 { border-color: var(--zinc-600); }
 .border-zinc-700 { border-color: var(--zinc-700); }
 .border-zinc-800 { border-color: var(--zinc-800); }
 .border-zinc-900 { border-color: var(--zinc-900); }
 .border-zinc-950 { border-color: var(--zinc-950); }



 /* ======= Netural =======*/
 :root {
	--neutral-50:  #fafafa;
	--neutral-100: #f5f5f5;
	--neutral-200: #e5e5e5;
	--neutral-300: #d4d4d4;
	--neutral-400: #a3a3a3;
	--neutral-500: #737373;
	--neutral-600: #525252;
	--neutral-700: #404040;
	--neutral-800: #262626;
	--neutral-900: #171717;
	--neutral-950: #0a0a0a;
 }
 
 /* Фоновые цвета */
 .bg-neutral-50  { background-color: var(--neutral-50);  }
 .bg-neutral-100 { background-color: var(--neutral-100); }
 .bg-neutral-200 { background-color: var(--neutral-200); }
 .bg-neutral-300 { background-color: var(--neutral-300); }
 .bg-neutral-400 { background-color: var(--neutral-400); }
 .bg-neutral-500 { background-color: var(--neutral-500); }
 .bg-neutral-600 { background-color: var(--neutral-600); }
 .bg-neutral-700 { background-color: var(--neutral-700); }
 .bg-neutral-800 { background-color: var(--neutral-800); }
 .bg-neutral-900 { background-color: var(--neutral-900); }
 .bg-neutral-950 { background-color: var(--neutral-950); }
 
 /* Цвет текста */
 .text-neutral-50 { color: var(--neutral-50);   }
 .text-neutral-100 { color: var(--neutral-100); }
 .text-neutral-200 { color: var(--neutral-200); }
 .text-neutral-300 { color: var(--neutral-300); }
 .text-neutral-400 { color: var(--neutral-400); }
 .text-neutral-500 { color: var(--neutral-500); }
 .text-neutral-600 { color: var(--neutral-600); }
 .text-neutral-700 { color: var(--neutral-700); }
 .text-neutral-800 { color: var(--neutral-800); }
 .text-neutral-900 { color: var(--neutral-900); }
 .text-neutral-950 { color: var(--neutral-950); }
 
 /* Цвет рамки */
 .border-neutral-50 { border-color: var(--neutral-50);   }
 .border-neutral-100 { border-color: var(--neutral-100); }
 .border-neutral-200 { border-color: var(--neutral-200); }
 .border-neutral-300 { border-color: var(--neutral-300); }
 .border-neutral-400 { border-color: var(--neutral-400); }
 .border-neutral-500 { border-color: var(--neutral-500); }
 .border-neutral-600 { border-color: var(--neutral-600); }
 .border-neutral-700 { border-color: var(--neutral-700); }
 .border-neutral-800 { border-color: var(--neutral-800); }
 .border-neutral-900 { border-color: var(--neutral-900); }
 .border-neutral-950 { border-color: var(--neutral-950); }





 /* ======= Stone =======*/
 :root {
	--stone-50:  #fafaf9;
	--stone-100: #f5f5f4;
	--stone-200: #e7e5e4;
	--stone-300: #d6d3d1;
	--stone-400: #a8a29e;
	--stone-500: #78716c;
	--stone-600: #57534e;
	--stone-700: #44403c;
	--stone-800: #292524;
	--stone-900: #1c1917;
	--stone-950: #0c0a09;
 }
 
 /* Фоновые цвета */
 .bg-stone-50 { background-color: var(--stone-50);   }
 .bg-stone-100 { background-color: var(--stone-100); }
 .bg-stone-200 { background-color: var(--stone-200); }
 .bg-stone-300 { background-color: var(--stone-300); }
 .bg-stone-400 { background-color: var(--stone-400); }
 .bg-stone-500 { background-color: var(--stone-500); }
 .bg-stone-600 { background-color: var(--stone-600); }
 .bg-stone-700 { background-color: var(--stone-700); }
 .bg-stone-800 { background-color: var(--stone-800); }
 .bg-stone-900 { background-color: var(--stone-900); }
 .bg-stone-950 { background-color: var(--stone-950); }
 
 /* Цвет текста */
 .text-stone-50 { color: var(--stone-50);   }
 .text-stone-100 { color: var(--stone-100); }
 .text-stone-200 { color: var(--stone-200); }
 .text-stone-300 { color: var(--stone-300); }
 .text-stone-400 { color: var(--stone-400); }
 .text-stone-500 { color: var(--stone-500); }
 .text-stone-600 { color: var(--stone-600); }
 .text-stone-700 { color: var(--stone-700); }
 .text-stone-800 { color: var(--stone-800); }
 .text-stone-900 { color: var(--stone-900); }
 .text-stone-950 { color: var(--stone-950); }
 
 /* Цвет рамки */
 .border-stone-50 { border-color: var(--stone-50);   }
 .border-stone-100 { border-color: var(--stone-100); }
 .border-stone-200 { border-color: var(--stone-200); }
 .border-stone-300 { border-color: var(--stone-300); }
 .border-stone-400 { border-color: var(--stone-400); }
 .border-stone-500 { border-color: var(--stone-500); }
 .border-stone-600 { border-color: var(--stone-600); }
 .border-stone-700 { border-color: var(--stone-700); }
 .border-stone-800 { border-color: var(--stone-800); }
 .border-stone-900 { border-color: var(--stone-900); }
 .border-stone-950 { border-color: var(--stone-950); }



/*========== Red =========*/
 :root {
	--red-50:  #fef2f2;
	--red-100: #fee2e2;
	--red-200: #fecaca;
	--red-300: #fca5a5;
	--red-400: #f87171;
	--red-500: #ef4444;
	--red-600: #dc2626;
	--red-700: #b91c1c;
	--red-800: #991c1c;
	--red-900: #7f1d1d;
	--red-950: #450a0a;
 }
 
 /* Фоновые цвета */
 .bg-red-50 { background-color: var(--red-50); }
 .bg-red-100 { background-color: var(--red-100); }
 .bg-red-200 { background-color: var(--red-200); }
 .bg-red-300 { background-color: var(--red-300); }
 .bg-red-400 { background-color: var(--red-400); }
 .bg-red-500 { background-color: var(--red-500); }
 .bg-red-600 { background-color: var(--red-600); }
 .bg-red-700 { background-color: var(--red-700); }
 .bg-red-800 { background-color: var(--red-800); }
 .bg-red-900 { background-color: var(--red-900); }
 .bg-red-950 { background-color: var(--red-950); }
 
 /* Цвет текста */
 .text-red-50 { color: var(--red-50); }
 .text-red-100 { color: var(--red-100); }
 .text-red-200 { color: var(--red-200); }
 .text-red-300 { color: var(--red-300); }
 .text-red-400 { color: var(--red-400); }
 .text-red-500 { color: var(--red-500); }
 .text-red-600 { color: var(--red-600); }
 .text-red-700 { color: var(--red-700); }
 .text-red-800 { color: var(--red-800); }
 .text-red-900 { color: var(--red-900); }
 .text-red-950 { color: var(--red-950); }
 
 /* Цвет рамки */
 .border-red-50 { border-color: var(--red-50); }
 .border-red-100 { border-color: var(--red-100); }
 .border-red-200 { border-color: var(--red-200); }
 .border-red-300 { border-color: var(--red-300); }
 .border-red-400 { border-color: var(--red-400); }
 .border-red-500 { border-color: var(--red-500); }
 .border-red-600 { border-color: var(--red-600); }
 .border-red-700 { border-color: var(--red-700); }
 .border-red-800 { border-color: var(--red-800); }
 .border-red-900 { border-color: var(--red-900); }
 .border-red-950 { border-color: var(--red-950); }






/*==========Yellow =========*/
 :root {
	--yellow-100: #fffff0;
	--yellow-200: #fefcbf;
	--yellow-300: #faf089;
	--yellow-400: #f6e05e;
	--yellow-500: #ecc94b;
	--yellow-600: #d69e2e;
	--yellow-700: #b7791f;
	--yellow-800: #975a16;
	--yellow-900: #744210;
 }
 
 /* Фоновые цвета */
 .bg-yellow-100 { background-color: var(--yellow-100); }
 .bg-yellow-200 { background-color: var(--yellow-200); }
 .bg-yellow-300 { background-color: var(--yellow-300); }
 .bg-yellow-400 { background-color: var(--yellow-400); }
 .bg-yellow-500 { background-color: var(--yellow-500); }
 .bg-yellow-600 { background-color: var(--yellow-600); }
 .bg-yellow-700 { background-color: var(--yellow-700); }
 .bg-yellow-800 { background-color: var(--yellow-800); }
 .bg-yellow-900 { background-color: var(--yellow-900); }
 
 /* Цвет текста */
 .text-yellow-100 { color: var(--yellow-100); }
 .text-yellow-200 { color: var(--yellow-200); }
 .text-yellow-300 { color: var(--yellow-300); }
 .text-yellow-400 { color: var(--yellow-400); }
 .text-yellow-500 { color: var(--yellow-500); }
 .text-yellow-600 { color: var(--yellow-600); }
 .text-yellow-700 { color: var(--yellow-700); }
 .text-yellow-800 { color: var(--yellow-800); }
 .text-yellow-900 { color: var(--yellow-900); }
 
 /* Цвет рамки */
 .border-yellow-100 { border-color: var(--yellow-100); }
 .border-yellow-200 { border-color: var(--yellow-200); }
 .border-yellow-300 { border-color: var(--yellow-300); }
 .border-yellow-400 { border-color: var(--yellow-400); }
 .border-yellow-500 { border-color: var(--yellow-500); }
 .border-yellow-600 { border-color: var(--yellow-600); }
 .border-yellow-700 { border-color: var(--yellow-700); }
 .border-yellow-800 { border-color: var(--yellow-800); }
 .border-yellow-900 { border-color: var(--yellow-900); }



/*========= Orange =========*/
:root {
	--orange-50:  #fff7ed;
	--orange-100: #ffedd5;
	--orange-200: #fed7aa;
	--orange-300: #fdba74;
	--orange-400: #fb923c;
	--orange-500: #f97316;
	--orange-600: #ea580c;
	--orange-700: #c2410c;
	--orange-800: #9a3412;
	--orange-900: #7c2d12;
	--orange-950: #431407;
 }
 
 /* Фоновые цвета */
 .bg-orange-50 { background-color: var(--orange-50);  }
 .bg-orange-100 { background-color: var(--orange-100); }
 .bg-orange-200 { background-color: var(--orange-200); }
 .bg-orange-300 { background-color: var(--orange-300); }
 .bg-orange-400 { background-color: var(--orange-400); }
 .bg-orange-500 { background-color: var(--orange-500); }
 .bg-orange-600 { background-color: var(--orange-600); }
 .bg-orange-700 { background-color: var(--orange-700); }
 .bg-orange-800 { background-color: var(--orange-800); }
 .bg-orange-900 { background-color: var(--orange-900); }
 .bg-orange-950 { background-color: var(--orange-950); }
 
 /* Цвет текста */
 .text-orange-50 { color: var(--orange-50);   }
 .text-orange-100 { color: var(--orange-100); }
 .text-orange-200 { color: var(--orange-200); }
 .text-orange-300 { color: var(--orange-300); }
 .text-orange-400 { color: var(--orange-400); }
 .text-orange-500 { color: var(--orange-500); }
 .text-orange-600 { color: var(--orange-600); }
 .text-orange-700 { color: var(--orange-700); }
 .text-orange-800 { color: var(--orange-800); }
 .text-orange-900 { color: var(--orange-900); }
 .text-orange-950 { color: var(--orange-950); }
 
 /* Цвет рамки */
 .border-orange-50 { border-color: var(--orange-50);   }
 .border-orange-100 { border-color: var(--orange-100); }
 .border-orange-200 { border-color: var(--orange-200); }
 .border-orange-300 { border-color: var(--orange-300); }
 .border-orange-400 { border-color: var(--orange-400); }
 .border-orange-500 { border-color: var(--orange-500); }
 .border-orange-600 { border-color: var(--orange-600); }
 .border-orange-700 { border-color: var(--orange-700); }
 .border-orange-800 { border-color: var(--orange-800); }
 .border-orange-900 { border-color: var(--orange-900); }
 .border-orange-950 { border-color: var(--orange-950); }


/*========= Amber ========*/
 :root {
	--amber-50:  #fffbeb;
	--amber-100: #fef3c7;
	--amber-200: #fde68a;
	--amber-300: #fcd34d;
	--amber-400: #fbbf24;
	--amber-500: #f59e0b;
	--amber-600: #d97706;
	--amber-700: #b45309;
	--amber-800: #92400e;
	--amber-900: #78350f;
	--amber-950: #451a03;
 }
 
 /* Фоновые цвета */
 .bg-amber-50  { background-color: var(--amber-50);  }
 .bg-amber-100 { background-color: var(--amber-100); }
 .bg-amber-200 { background-color: var(--amber-200); }
 .bg-amber-300 { background-color: var(--amber-300); }
 .bg-amber-400 { background-color: var(--amber-400); }
 .bg-amber-500 { background-color: var(--amber-500); }
 .bg-amber-600 { background-color: var(--amber-600); }
 .bg-amber-700 { background-color: var(--amber-700); }
 .bg-amber-800 { background-color: var(--amber-800); }
 .bg-amber-900 { background-color: var(--amber-900); }
 .bg-amber-950 { background-color: var(--amber-950); }
 
 /* Цвет текста */
 .text-amber-50  { color: var(--amber-50);  }
 .text-amber-100 { color: var(--amber-100); }
 .text-amber-200 { color: var(--amber-200); }
 .text-amber-300 { color: var(--amber-300); }
 .text-amber-400 { color: var(--amber-400); }
 .text-amber-500 { color: var(--amber-500); }
 .text-amber-600 { color: var(--amber-600); }
 .text-amber-700 { color: var(--amber-700); }
 .text-amber-800 { color: var(--amber-800); }
 .text-amber-900 { color: var(--amber-900); }
 .text-amber-950 { color: var(--amber-950); }
 
 /* Цвет рамки */
 .border-amber-50  { border-color: var(--amber-50);  }
 .border-amber-100 { border-color: var(--amber-100); }
 .border-amber-200 { border-color: var(--amber-200); }
 .border-amber-300 { border-color: var(--amber-300); }
 .border-amber-400 { border-color: var(--amber-400); }
 .border-amber-500 { border-color: var(--amber-500); }
 .border-amber-600 { border-color: var(--amber-600); }
 .border-amber-700 { border-color: var(--amber-700); }
 .border-amber-800 { border-color: var(--amber-800); }
 .border-amber-900 { border-color: var(--amber-900); }
 .border-amber-950 { border-color: var(--amber-950); }



/*======= Yellow ==========*/

:root {
	--yellow-50:  #fefce8;
	--yellow-100: #fef9c3;
	--yellow-200: #fef08a;
	--yellow-300: #fde047;
	--yellow-400: #facc15;
	--yellow-500: #eab308;
	--yellow-600: #ca8a04;
	--yellow-700: #a16207;
	--yellow-800: #854d0e;
	--yellow-900: #713f12;
	--yellow-950: #422006;
 }
 
 /* Фоновые цвета */
 .bg-yellow-50  { background-color: var(--yellow-50);  }
 .bg-yellow-100 { background-color: var(--yellow-100); }
 .bg-yellow-200 { background-color: var(--yellow-200); }
 .bg-yellow-300 { background-color: var(--yellow-300); }
 .bg-yellow-400 { background-color: var(--yellow-400); }
 .bg-yellow-500 { background-color: var(--yellow-500); }
 .bg-yellow-600 { background-color: var(--yellow-600); }
 .bg-yellow-700 { background-color: var(--yellow-700); }
 .bg-yellow-800 { background-color: var(--yellow-800); }
 .bg-yellow-900 { background-color: var(--yellow-900); }
 .bg-yellow-950 { background-color: var(--yellow-950); }
 
 /* Цвет текста */
 .text-yellow-50  { color: var(--yellow-50);  }
 .text-yellow-100 { color: var(--yellow-100); }
 .text-yellow-200 { color: var(--yellow-200); }
 .text-yellow-300 { color: var(--yellow-300); }
 .text-yellow-400 { color: var(--yellow-400); }
 .text-yellow-500 { color: var(--yellow-500); }
 .text-yellow-600 { color: var(--yellow-600); }
 .text-yellow-700 { color: var(--yellow-700); }
 .text-yellow-800 { color: var(--yellow-800); }
 .text-yellow-900 { color: var(--yellow-900); }
 .text-yellow-950 { color: var(--yellow-950); }
 
 /* Цвет рамки */
 .border-yellow-50  { border-color: var(--yellow-50);  }
 .border-yellow-100 { border-color: var(--yellow-100); }
 .border-yellow-200 { border-color: var(--yellow-200); }
 .border-yellow-300 { border-color: var(--yellow-300); }
 .border-yellow-400 { border-color: var(--yellow-400); }
 .border-yellow-500 { border-color: var(--yellow-500); }
 .border-yellow-600 { border-color: var(--yellow-600); }
 .border-yellow-700 { border-color: var(--yellow-700); }
 .border-yellow-800 { border-color: var(--yellow-800); }
 .border-yellow-900 { border-color: var(--yellow-900); }
 .border-yellow-950 { border-color: var(--yellow-950); }




/*========== Lime ==========*/

:root {
	--lime-50: #f7fee7;
	--lime-100: #ecfccb;
	--lime-200: #d9f99d;
	--lime-300: #bef264;
	--lime-400: #a3e635;
	--lime-500: #84cc16;
	--lime-600: #65a30d;
	--lime-700: #4d7c0f;
	--lime-800: #3f6212;
	--lime-900: #365314;
	--lime-950: #1a2e05;
 }
 
 /* Фоновые цвета */
 .bg-lime-50 { background-color: var(--lime-50); }
 .bg-lime-100 { background-color: var(--lime-100); }
 .bg-lime-200 { background-color: var(--lime-200); }
 .bg-lime-300 { background-color: var(--lime-300); }
 .bg-lime-400 { background-color: var(--lime-400); }
 .bg-lime-500 { background-color: var(--lime-500); }
 .bg-lime-600 { background-color: var(--lime-600); }
 .bg-lime-700 { background-color: var(--lime-700); }
 .bg-lime-800 { background-color: var(--lime-800); }
 .bg-lime-900 { background-color: var(--lime-900); }
 .bg-lime-950 { background-color: var(--lime-950); }
 
 /* Цвет текста */
 .text-lime-50 { color: var(--lime-50); }
 .text-lime-100 { color: var(--lime-100); }
 .text-lime-200 { color: var(--lime-200); }
 .text-lime-300 { color: var(--lime-300); }
 .text-lime-400 { color: var(--lime-400); }
 .text-lime-500 { color: var(--lime-500); }
 .text-lime-600 { color: var(--lime-600); }
 .text-lime-700 { color: var(--lime-700); }
 .text-lime-800 { color: var(--lime-800); }
 .text-lime-900 { color: var(--lime-900); }
 .text-lime-950 { color: var(--lime-950); }
 
 /* Цвет рамки */
 .border-lime-50 { border-color: var(--lime-50); }
 .border-lime-100 { border-color: var(--lime-100); }
 .border-lime-200 { border-color: var(--lime-200); }
 .border-lime-300 { border-color: var(--lime-300); }
 .border-lime-400 { border-color: var(--lime-400); }
 .border-lime-500 { border-color: var(--lime-500); }
 .border-lime-600 { border-color: var(--lime-600); }
 .border-lime-700 { border-color: var(--lime-700); }
 .border-lime-800 { border-color: var(--lime-800); }
 .border-lime-900 { border-color: var(--lime-900); }
 .border-lime-950 { border-color: var(--lime-950); }




 /*======== Green ========*/
 :root {
	--green-50: #f0fdf4;
	--green-100: #dcfce7;
	--green-200: #bbf7d0;
	--green-300: #86efac;
	--green-400: #4ade80;
	--green-500: #22c55e;
	--green-600: #16a34a;
	--green-700: #15803d;
	--green-800: #166534;
	--green-900: #14532d;
	--green-950: #052e16;
 }
 
 .bg-green-50 { background-color: var(--green-50); }
 .bg-green-100 { background-color: var(--green-100); }
 .bg-green-200 { background-color: var(--green-200); }
 .bg-green-300 { background-color: var(--green-300); }
 .bg-green-400 { background-color: var(--green-400); }
 .bg-green-500 { background-color: var(--green-500); }
 .bg-green-600 { background-color: var(--green-600); }
 .bg-green-700 { background-color: var(--green-700); }
 .bg-green-800 { background-color: var(--green-800); }
 .bg-green-900 { background-color: var(--green-900); }
 .bg-green-950 { background-color: var(--green-950); }
 
 /* Цвет текста */
 .text-green-50 { color: var(--green-50); }
 .text-green-100 { color: var(--green-100); }
 .text-green-200 { color: var(--green-200); }
 .text-green-300 { color: var(--green-300); }
 .text-green-400 { color: var(--green-400); }
 .text-green-500 { color: var(--green-500); }
 .text-green-600 { color: var(--green-600); }
 .text-green-700 { color: var(--green-700); }
 .text-green-800 { color: var(--green-800); }
 .text-green-900 { color: var(--green-900); }
 .text-green-950 { color: var(--green-950); }
 
 /* Цвет рамки */
 .border-green-50 { border-color: var(--green-50); }
 .border-green-100 { border-color: var(--green-100); }
 .border-green-200 { border-color: var(--green-200); }
 .border-green-300 { border-color: var(--green-300); }
 .border-green-400 { border-color: var(--green-400); }
 .border-green-500 { border-color: var(--green-500); }
 .border-green-600 { border-color: var(--green-600); }
 .border-green-700 { border-color: var(--green-700); }
 .border-green-800 { border-color: var(--green-800); }
 .border-green-900 { border-color: var(--green-900); }
 .border-green-950 { border-color: var(--green-950); }




  /*======== Emerald ========*/
 :root {
	--emerald-50: #ecfdf5;
	--emerald-100: #d1fae5;
	--emerald-200: #a7f3d0;
	--emerald-300: #6ee7b7;
	--emerald-400: #34d399;
	--emerald-500: #10b981;
	--emerald-600: #059669;
	--emerald-700: #047857;
	--emerald-800: #065f46;
	--emerald-900: #064e3b;
	--emerald-950: #022c22;
 }
 
 .bg-emerald-50 { background-color: var(--emerald-50); }
 .bg-emerald-100 { background-color: var(--emerald-100); }
 .bg-emerald-200 { background-color: var(--emerald-200); }
 .bg-emerald-300 { background-color: var(--emerald-300); }
 .bg-emerald-400 { background-color: var(--emerald-400); }
 .bg-emerald-500 { background-color: var(--emerald-500); }
 .bg-emerald-600 { background-color: var(--emerald-600); }
 .bg-emerald-700 { background-color: var(--emerald-700); }
 .bg-emerald-800 { background-color: var(--emerald-800); }
 .bg-emerald-900 { background-color: var(--emerald-900); }
 .bg-emerald-950 { background-color: var(--emerald-950); }
 
 .text-emerald-50 { color: var(--emerald-50); }
 .text-emerald-100 { color: var(--emerald-100); }
 .text-emerald-200 { color: var(--emerald-200); }
 .text-emerald-300 { color: var(--emerald-300); }
 .text-emerald-400 { color: var(--emerald-400); }
 .text-emerald-500 { color: var(--emerald-500); }
 .text-emerald-600 { color: var(--emerald-600); }
 .text-emerald-700 { color: var(--emerald-700); }
 .text-emerald-800 { color: var(--emerald-800); }
 .text-emerald-900 { color: var(--emerald-900); }
 .text-emerald-950 { color: var(--emerald-950); }
 
 .border-emerald-50 { border-color: var(--emerald-50); }
 .border-emerald-100 { border-color: var(--emerald-100); }
 .border-emerald-200 { border-color: var(--emerald-200); }
 .border-emerald-300 { border-color: var(--emerald-300); }
 .border-emerald-400 { border-color: var(--emerald-400); }
 .border-emerald-500 { border-color: var(--emerald-500); }
 .border-emerald-600 { border-color: var(--emerald-600); }
 .border-emerald-700 { border-color: var(--emerald-700); }
 .border-emerald-800 { border-color: var(--emerald-800); }
 .border-emerald-900 { border-color: var(--emerald-900); }
 .border-emerald-950 { border-color: var(--emerald-950); }



 /*======== Teal ========*/
 :root {
	--teal-50: #f0fdfa;
	--teal-100: #ccfbf1;
	--teal-200: #99f6e4;
	--teal-300: #5eead4;
	--teal-400: #2dd4bf;
	--teal-500: #14b8a6;
	--teal-600: #0d9488;
	--teal-700: #0f766e;
	--teal-800: #115e59;
	--teal-900: #134e4a;
	--teal-950: #042f2e;
 }
 
 .bg-teal-50 { background-color: var(--teal-50); }
 .bg-teal-100 { background-color: var(--teal-100); }
 .bg-teal-200 { background-color: var(--teal-200); }
 .bg-teal-300 { background-color: var(--teal-300); }
 .bg-teal-400 { background-color: var(--teal-400); }
 .bg-teal-500 { background-color: var(--teal-500); }
 .bg-teal-600 { background-color: var(--teal-600); }
 .bg-teal-700 { background-color: var(--teal-700); }
 .bg-teal-800 { background-color: var(--teal-800); }
 .bg-teal-900 { background-color: var(--teal-900); }
 .bg-teal-950 { background-color: var(--teal-950); }
 
 .text-teal-50 { color: var(--teal-50); }
 .text-teal-100 { color: var(--teal-100); }
 .text-teal-200 { color: var(--teal-200); }
 .text-teal-300 { color: var(--teal-300); }
 .text-teal-400 { color: var(--teal-400); }
 .text-teal-500 { color: var(--teal-500); }
 .text-teal-600 { color: var(--teal-600); }
 .text-teal-700 { color: var(--teal-700); }
 .text-teal-800 { color: var(--teal-800); }
 .text-teal-900 { color: var(--teal-900); }
 .text-teal-950 { color: var(--teal-950); }
 
 .border-teal-50 { border-color: var(--teal-50); }
 .border-teal-100 { border-color: var(--teal-100); }
 .border-teal-200 { border-color: var(--teal-200); }
 .border-teal-300 { border-color: var(--teal-300); }
 .border-teal-400 { border-color: var(--teal-400); }
 .border-teal-500 { border-color: var(--teal-500); }
 .border-teal-600 { border-color: var(--teal-600); }
 .border-teal-700 { border-color: var(--teal-700); }
 .border-teal-800 { border-color: var(--teal-800); }
 .border-teal-900 { border-color: var(--teal-900); }
 .border-teal-950 { border-color: var(--teal-950); }



 /*======== Cyan ========*/
 :root {
	--cyan-50: #ecfeff;
	--cyan-100: #cffafe;
	--cyan-200: #a5f3fc;
	--cyan-300: #67e8f9;
	--cyan-400: #22d3ee;
	--cyan-500: #06b6d4;
	--cyan-600: #0891b2;
	--cyan-700: #0e7490;
	--cyan-800: #155e75;
	--cyan-900: #164e63;
	--cyan-950: #083344;
 }
 
 .bg-cyan-50 { background-color: var(--cyan-50); }
 .bg-cyan-100 { background-color: var(--cyan-100); }
 .bg-cyan-200 { background-color: var(--cyan-200); }
 .bg-cyan-300 { background-color: var(--cyan-300); }
 .bg-cyan-400 { background-color: var(--cyan-400); }
 .bg-cyan-500 { background-color: var(--cyan-500); }
 .bg-cyan-600 { background-color: var(--cyan-600); }
 .bg-cyan-700 { background-color: var(--cyan-700); }
 .bg-cyan-800 { background-color: var(--cyan-800); }
 .bg-cyan-900 { background-color: var(--cyan-900); }
 .bg-cyan-950 { background-color: var(--cyan-950); }
 
 .text-cyan-50 { color: var(--cyan-50); }
 .text-cyan-100 { color: var(--cyan-100); }
 .text-cyan-200 { color: var(--cyan-200); }
 .text-cyan-300 { color: var(--cyan-300); }
 .text-cyan-400 { color: var(--cyan-400); }
 .text-cyan-500 { color: var(--cyan-500); }
 .text-cyan-600 { color: var(--cyan-600); }
 .text-cyan-700 { color: var(--cyan-700); }
 .text-cyan-800 { color: var(--cyan-800); }
 .text-cyan-900 { color: var(--cyan-900); }
 .text-cyan-950 { color: var(--cyan-950); }
 
 .border-cyan-50 { border-color: var(--cyan-50); }
 .border-cyan-100 { border-color: var(--cyan-100); }
 .border-cyan-200 { border-color: var(--cyan-200); }
 .border-cyan-300 { border-color: var(--cyan-300); }
 .border-cyan-400 { border-color: var(--cyan-400); }
 .border-cyan-500 { border-color: var(--cyan-500); }
 .border-cyan-600 { border-color: var(--cyan-600); }
 .border-cyan-700 { border-color: var(--cyan-700); }
 .border-cyan-800 { border-color: var(--cyan-800); }
 .border-cyan-900 { border-color: var(--cyan-900); }
 .border-cyan-950 { border-color: var(--cyan-950); }



 /*======== Sky ========*/
 :root {
	--sky-50: #f0f9ff;
	--sky-100: #e0f2fe;
	--sky-200: #bae6fd;
	--sky-300: #7dd3fc;
	--sky-400: #38bdf8;
	--sky-500: #0ea5e9;
	--sky-600: #0284c7;
	--sky-700: #0369a1;
	--sky-800: #075985;
	--sky-900: #0c4a6e;
	--sky-950: #082f49;
 }
 
 .bg-sky-50 { background-color: var(--sky-50); }
 .bg-sky-100 { background-color: var(--sky-100); }
 .bg-sky-200 { background-color: var(--sky-200); }
 .bg-sky-300 { background-color: var(--sky-300); }
 .bg-sky-400 { background-color: var(--sky-400); }
 .bg-sky-500 { background-color: var(--sky-500); }
 .bg-sky-600 { background-color: var(--sky-600); }
 .bg-sky-700 { background-color: var(--sky-700); }
 .bg-sky-800 { background-color: var(--sky-800); }
 .bg-sky-900 { background-color: var(--sky-900); }
 .bg-sky-950 { background-color: var(--sky-950); }
 
 .text-sky-50 { color: var(--sky-50); }
 .text-sky-100 { color: var(--sky-100); }
 .text-sky-200 { color: var(--sky-200); }
 .text-sky-300 { color: var(--sky-300); }
 .text-sky-400 { color: var(--sky-400); }
 .text-sky-500 { color: var(--sky-500); }
 .text-sky-600 { color: var(--sky-600); }
 .text-sky-700 { color: var(--sky-700); }
 .text-sky-800 { color: var(--sky-800); }
 .text-sky-900 { color: var(--sky-900); }
 .text-sky-950 { color: var(--sky-950); }
 
 .border-sky-50 { border-color: var(--sky-50); }
 .border-sky-100 { border-color: var(--sky-100); }
 .border-sky-200 { border-color: var(--sky-200); }
 .border-sky-300 { border-color: var(--sky-300); }
 .border-sky-400 { border-color: var(--sky-400); }
 .border-sky-500 { border-color: var(--sky-500); }
 .border-sky-600 { border-color: var(--sky-600); }
 .border-sky-700 { border-color: var(--sky-700); }
 .border-sky-800 { border-color: var(--sky-800); }
 .border-sky-900 { border-color: var(--sky-900); }
 .border-sky-950 { border-color: var(--sky-950); }



/*======== Blue ========*/
:root {
	--blue-50:  #eff6ff;
	--blue-100: #dbeafe;
	--blue-200: #bfdbfe;
	--blue-300: #93c5fd;
	--blue-400: #60a5fa;
	--blue-500: #3b82f6;
	--blue-600: #2563eb;
	--blue-700: #1d4ed8;
	--blue-800: #1e40af;
	--blue-900: #1e3a8a;
	--blue-950: #172554;
 }
 
 .bg-blue-50  { background-color: var(--blue-50);  }
 .bg-blue-100 { background-color: var(--blue-100); }
 .bg-blue-200 { background-color: var(--blue-200); }
 .bg-blue-300 { background-color: var(--blue-300); }
 .bg-blue-400 { background-color: var(--blue-400); }
 .bg-blue-500 { background-color: var(--blue-500); }
 .bg-blue-600 { background-color: var(--blue-600); }
 .bg-blue-700 { background-color: var(--blue-700); }
 .bg-blue-800 { background-color: var(--blue-800); }
 .bg-blue-900 { background-color: var(--blue-900); }
 .bg-blue-950 { background-color: var(--blue-950); }
 
 .text-blue-50  { color: var(--blue-50);  }
 .text-blue-100 { color: var(--blue-100); }
 .text-blue-200 { color: var(--blue-200); }
 .text-blue-300 { color: var(--blue-300); }
 .text-blue-400 { color: var(--blue-400); }
 .text-blue-500 { color: var(--blue-500); }
 .text-blue-600 { color: var(--blue-600); }
 .text-blue-700 { color: var(--blue-700); }
 .text-blue-800 { color: var(--blue-800); }
 .text-blue-900 { color: var(--blue-900); }
 .text-blue-950 { color: var(--blue-950); }
 
 .border-blue-50  { border-color: var(--blue-50);  }
 .border-blue-100 { border-color: var(--blue-100); }
 .border-blue-200 { border-color: var(--blue-200); }
 .border-blue-300 { border-color: var(--blue-300); }
 .border-blue-400 { border-color: var(--blue-400); }
 .border-blue-500 { border-color: var(--blue-500); }
 .border-blue-600 { border-color: var(--blue-600); }
 .border-blue-700 { border-color: var(--blue-700); }
 .border-blue-800 { border-color: var(--blue-800); }
 .border-blue-900 { border-color: var(--blue-900); }
 .border-blue-950 { border-color: var(--blue-950); }




/*======== Indigo =========*/
:root {
	--indigo-50: #eef2ff;
	--indigo-100: #e0e7ff;
	--indigo-200: #c7d2fe;
	--indigo-300: #a5b4fc;
	--indigo-400: #818cf8;
	--indigo-500: #6366f1;
	--indigo-600: #4f46e5;
	--indigo-700: #4338ca;
	--indigo-800: #3730a3;
	--indigo-900: #312e81;
	--indigo-950: #1e1b4b;
 }
 
 .bg-indigo-50 { background-color: var(--indigo-50); }
 .bg-indigo-100 { background-color: var(--indigo-100); }
 .bg-indigo-200 { background-color: var(--indigo-200); }
 .bg-indigo-300 { background-color: var(--indigo-300); }
 .bg-indigo-400 { background-color: var(--indigo-400); }
 .bg-indigo-500 { background-color: var(--indigo-500); }
 .bg-indigo-600 { background-color: var(--indigo-600); }
 .bg-indigo-700 { background-color: var(--indigo-700); }
 .bg-indigo-800 { background-color: var(--indigo-800); }
 .bg-indigo-900 { background-color: var(--indigo-900); }
 .bg-indigo-950 { background-color: var(--indigo-950); }
 
 .text-indigo-50 { color: var(--indigo-50); }
 .text-indigo-100 { color: var(--indigo-100); }
 .text-indigo-200 { color: var(--indigo-200); }
 .text-indigo-300 { color: var(--indigo-300); }
 .text-indigo-400 { color: var(--indigo-400); }
 .text-indigo-500 { color: var(--indigo-500); }
 .text-indigo-600 { color: var(--indigo-600); }
 .text-indigo-700 { color: var(--indigo-700); }
 .text-indigo-800 { color: var(--indigo-800); }
 .text-indigo-900 { color: var(--indigo-900); }
 .text-indigo-950 { color: var(--indigo-950); }
 
 .border-indigo-50 { border-color: var(--indigo-50); }
 .border-indigo-100 { border-color: var(--indigo-100); }
 .border-indigo-200 { border-color: var(--indigo-200); }
 .border-indigo-300 { border-color: var(--indigo-300); }
 .border-indigo-400 { border-color: var(--indigo-400); }
 .border-indigo-500 { border-color: var(--indigo-500); }
 .border-indigo-600 { border-color: var(--indigo-600); }
 .border-indigo-700 { border-color: var(--indigo-700); }
 .border-indigo-800 { border-color: var(--indigo-800); }
 .border-indigo-900 { border-color: var(--indigo-900); }
 .border-indigo-950 { border-color: var(--indigo-950); }





/*======= Violete =========*/
:root {
	--violet-50: #f5f3ff;
	--violet-100: #ede9fe;
	--violet-200: #ddd6fe;
	--violet-300: #c4b5fd;
	--violet-400: #a78bfa;
	--violet-500: #8b5cf6;
	--violet-600: #7c3aed;
	--violet-700: #6d28d9;
	--violet-800: #5b21b6;
	--violet-900: #4c1d95;
	--violet-950: #2e1065;
 }
 
 .bg-violet-50 { background-color: var(--violet-50); }
 .bg-violet-100 { background-color: var(--violet-100); }
 .bg-violet-200 { background-color: var(--violet-200); }
 .bg-violet-300 { background-color: var(--violet-300); }
 .bg-violet-400 { background-color: var(--violet-400); }
 .bg-violet-500 { background-color: var(--violet-500); }
 .bg-violet-600 { background-color: var(--violet-600); }
 .bg-violet-700 { background-color: var(--violet-700); }
 .bg-violet-800 { background-color: var(--violet-800); }
 .bg-violet-900 { background-color: var(--violet-900); }
 .bg-violet-950 { background-color: var(--violet-950); }
 
 .text-violet-50 { color: var(--violet-50); }
 .text-violet-100 { color: var(--violet-100); }
 .text-violet-200 { color: var(--violet-200); }
 .text-violet-300 { color: var(--violet-300); }
 .text-violet-400 { color: var(--violet-400); }
 .text-violet-500 { color: var(--violet-500); }
 .text-violet-600 { color: var(--violet-600); }
 .text-violet-700 { color: var(--violet-700); }
 .text-violet-800 { color: var(--violet-800); }
 .text-violet-900 { color: var(--violet-900); }
 .text-violet-950 { color: var(--violet-950); }
 
 .border-violet-50 { border-color: var(--violet-50); }
 .border-violet-100 { border-color: var(--violet-100); }
 .border-violet-200 { border-color: var(--violet-200); }
 .border-violet-300 { border-color: var(--violet-300); }
 .border-violet-400 { border-color: var(--violet-400); }
 .border-violet-500 { border-color: var(--violet-500); }
 .border-violet-600 { border-color: var(--violet-600); }
 .border-violet-700 { border-color: var(--violet-700); }
 .border-violet-800 { border-color: var(--violet-800); }
 .border-violet-900 { border-color: var(--violet-900); }
 .border-violet-950 { border-color: var(--violet-950); }






/* ======== Purple =========*/
 :root {
	--purple-50: #faf5ff;
	--purple-100: #f3e8ff;
	--purple-200: #e9d5ff;
	--purple-300: #d8b4fe;
	--purple-400: #c084fc;
	--purple-500: #a855f7;
	--purple-600: #9333ea;
	--purple-700: #7e22ce;
	--purple-800: #6b21a8;
	--purple-900: #581c87;
	--purple-950: #3b0764;
 }
 
 .bg-purple-50  { background-color: var(--purple-50);  }
 .bg-purple-100 { background-color: var(--purple-100); }
 .bg-purple-200 { background-color: var(--purple-200); }
 .bg-purple-300 { background-color: var(--purple-300); }
 .bg-purple-400 { background-color: var(--purple-400); }
 .bg-purple-500 { background-color: var(--purple-500); }
 .bg-purple-600 { background-color: var(--purple-600); }
 .bg-purple-700 { background-color: var(--purple-700); }
 .bg-purple-800 { background-color: var(--purple-800); }
 .bg-purple-900 { background-color: var(--purple-900); }
 .bg-purple-950 { background-color: var(--purple-950); }
 
 .text-purple-50  { color: var(--purple-50);  }
 .text-purple-100 { color: var(--purple-100); }
 .text-purple-200 { color: var(--purple-200); }
 .text-purple-300 { color: var(--purple-300); }
 .text-purple-400 { color: var(--purple-400); }
 .text-purple-500 { color: var(--purple-500); }
 .text-purple-600 { color: var(--purple-600); }
 .text-purple-700 { color: var(--purple-700); }
 .text-purple-800 { color: var(--purple-800); }
 .text-purple-900 { color: var(--purple-900); }
 .text-purple-950 { color: var(--purple-950); }
 
 .border-purple-50  { border-color: var(--purple-50);  }
 .border-purple-100 { border-color: var(--purple-100); }
 .border-purple-200 { border-color: var(--purple-200); }
 .border-purple-300 { border-color: var(--purple-300); }
 .border-purple-400 { border-color: var(--purple-400); }
 .border-purple-500 { border-color: var(--purple-500); }
 .border-purple-600 { border-color: var(--purple-600); }
 .border-purple-700 { border-color: var(--purple-700); }
 .border-purple-800 { border-color: var(--purple-800); }
 .border-purple-900 { border-color: var(--purple-900); }
 .border-purple-950 { border-color: var(--purple-950); }




/* ======== Fuchsia =========*/
 :root {
	--fuchsia-50:  #fdf4ff;
	--fuchsia-100: #fae8ff;
	--fuchsia-200: #f5d0fe;
	--fuchsia-300: #f0abfc;
	--fuchsia-400: #e879f9;
	--fuchsia-500: #d946ef;
	--fuchsia-600: #c026d3;
	--fuchsia-700: #a21caf;
	--fuchsia-800: #86198f;
	--fuchsia-900: #701a75;
	--fuchsia-950: #4a044e;
 }
 
 .bg-fuchsia-50  { background-color: var(--fuchsia-50);  }
 .bg-fuchsia-100 { background-color: var(--fuchsia-100); }
 .bg-fuchsia-200 { background-color: var(--fuchsia-200); }
 .bg-fuchsia-300 { background-color: var(--fuchsia-300); }
 .bg-fuchsia-400 { background-color: var(--fuchsia-400); }
 .bg-fuchsia-500 { background-color: var(--fuchsia-500); }
 .bg-fuchsia-600 { background-color: var(--fuchsia-600); }
 .bg-fuchsia-700 { background-color: var(--fuchsia-700); }
 .bg-fuchsia-800 { background-color: var(--fuchsia-800); }
 .bg-fuchsia-900 { background-color: var(--fuchsia-900); }
 .bg-fuchsia-950 { background-color: var(--fuchsia-950); }
 
 .text-fuchsia-50  { color: var(--fuchsia-50); 	}
 .text-fuchsia-100 { color: var(--fuchsia-100); }
 .text-fuchsia-200 { color: var(--fuchsia-200); }
 .text-fuchsia-300 { color: var(--fuchsia-300); }
 .text-fuchsia-400 { color: var(--fuchsia-400); }
 .text-fuchsia-500 { color: var(--fuchsia-500); }
 .text-fuchsia-600 { color: var(--fuchsia-600); }
 .text-fuchsia-700 { color: var(--fuchsia-700); }
 .text-fuchsia-800 { color: var(--fuchsia-800); }
 .text-fuchsia-900 { color: var(--fuchsia-900); }
 .text-fuchsia-950 { color: var(--fuchsia-950); }
 
 .border-fuchsia-50 	{ border-color: var(--fuchsia-50); 	}
 .border-fuchsia-100 { border-color: var(--fuchsia-100); }
 .border-fuchsia-200 { border-color: var(--fuchsia-200); }
 .border-fuchsia-300 { border-color: var(--fuchsia-300); }
 .border-fuchsia-400 { border-color: var(--fuchsia-400); }
 .border-fuchsia-500 { border-color: var(--fuchsia-500); }
 .border-fuchsia-600 { border-color: var(--fuchsia-600); }
 .border-fuchsia-700 { border-color: var(--fuchsia-700); }
 .border-fuchsia-800 { border-color: var(--fuchsia-800); }
 .border-fuchsia-900 { border-color: var(--fuchsia-900); }
 .border-fuchsia-950 { border-color: var(--fuchsia-950); }



 /* ======== Pink =========*/
 :root {
	--pink-50:  #fdf2f8;
	--pink-100: #fce7f3;
	--pink-200: #fbcfe8;
	--pink-300: #f9a8d4;
	--pink-400: #f472b6;
	--pink-500: #ec4899;
	--pink-600: #db2777;
	--pink-700: #be185d;
	--pink-800: #9d174d;
	--pink-900: #831843;
	--pink-950: #500724;
 }
 
 .bg-pink-50  { background-color: var(--pink-50);  }
 .bg-pink-100 { background-color: var(--pink-100); }
 .bg-pink-200 { background-color: var(--pink-200); }
 .bg-pink-300 { background-color: var(--pink-300); }
 .bg-pink-400 { background-color: var(--pink-400); }
 .bg-pink-500 { background-color: var(--pink-500); }
 .bg-pink-600 { background-color: var(--pink-600); }
 .bg-pink-700 { background-color: var(--pink-700); }
 .bg-pink-800 { background-color: var(--pink-800); }
 .bg-pink-900 { background-color: var(--pink-900); }
 .bg-pink-950 { background-color: var(--pink-950); }
 
 .text-pink-50  { color: var(--pink-50);  }
 .text-pink-100 { color: var(--pink-100); }
 .text-pink-200 { color: var(--pink-200); }
 .text-pink-300 { color: var(--pink-300); }
 .text-pink-400 { color: var(--pink-400); }
 .text-pink-500 { color: var(--pink-500); }
 .text-pink-600 { color: var(--pink-600); }
 .text-pink-700 { color: var(--pink-700); }
 .text-pink-800 { color: var(--pink-800); }
 .text-pink-900 { color: var(--pink-900); }
 .text-pink-950 { color: var(--pink-950); }
 
 .border-pink-50  { border-color: var(--pink-50); }
 .border-pink-100 { border-color: var(--pink-100); }
 .border-pink-200 { border-color: var(--pink-200); }
 .border-pink-300 { border-color: var(--pink-300); }
 .border-pink-400 { border-color: var(--pink-400); }
 .border-pink-500 { border-color: var(--pink-500); }
 .border-pink-600 { border-color: var(--pink-600); }
 .border-pink-700 { border-color: var(--pink-700); }
 .border-pink-800 { border-color: var(--pink-800); }
 .border-pink-900 { border-color: var(--pink-900); }
 .border-pink-950 { border-color: var(--pink-950); }


  /* ======== Rose ========= */

  :root {
	--rose-50: #fff1f2;
	--rose-100: #ffe4e6;
	--rose-200: #fecdd3;
	--rose-300: #fda4af;
	--rose-400: #fb7185;
	--rose-500: #f43f5e;
	--rose-600: #e11d48;
	--rose-700: #be123c;
	--rose-800: #9f1239;
	--rose-900: #881337;
	--rose-950: #4c0519;
 }
 
 .bg-rose-50 { background-color: var(--rose-50); }
 .bg-rose-100 { background-color: var(--rose-100); }
 .bg-rose-200 { background-color: var(--rose-200); }
 .bg-rose-300 { background-color: var(--rose-300); }
 .bg-rose-400 { background-color: var(--rose-400); }
 .bg-rose-500 { background-color: var(--rose-500); }
 .bg-rose-600 { background-color: var(--rose-600); }
 .bg-rose-700 { background-color: var(--rose-700); }
 .bg-rose-800 { background-color: var(--rose-800); }
 .bg-rose-900 { background-color: var(--rose-900); }
 .bg-rose-950 { background-color: var(--rose-950); }
 
 .text-rose-50 { color: var(--rose-50); }
 .text-rose-100 { color: var(--rose-100); }
 .text-rose-200 { color: var(--rose-200); }
 .text-rose-300 { color: var(--rose-300); }
 .text-rose-400 { color: var(--rose-400); }
 .text-rose-500 { color: var(--rose-500); }
 .text-rose-600 { color: var(--rose-600); }
 .text-rose-700 { color: var(--rose-700); }
 .text-rose-800 { color: var(--rose-800); }
 .text-rose-900 { color: var(--rose-900); }
 .text-rose-950 { color: var(--rose-950); }
 
 .border-rose-50 { border-color: var(--rose-50); }
 .border-rose-100 { border-color: var(--rose-100); }
 .border-rose-200 { border-color: var(--rose-200); }
 .border-rose-300 { border-color: var(--rose-300); }
 .border-rose-400 { border-color: var(--rose-400); }
 .border-rose-500 { border-color: var(--rose-500); }
 .border-rose-600 { border-color: var(--rose-600); }
 .border-rose-700 { border-color: var(--rose-700); }
 .border-rose-800 { border-color: var(--rose-800); }
 .border-rose-900 { border-color: var(--rose-900); }
 .border-rose-950 { border-color: var(--rose-950); }