@charset "UTF-8";

/***** Panel de Snippets *****/

:root {
  --white10: rgba(255,255,255,0.1);
  --white20: rgba(255,255,255,0.2);
  --white30: rgba(255,255,255,0.3);
  --white40: rgba(255,255,255,0.4);
  --white50: rgba(255,255,255,0.5);
  --white60: rgba(255,255,255,0.6);
  --white70: rgba(255,255,255,0.7);
  --white80: rgba(255,255,255,0.8);
  --white90: rgba(255,255,255,0.9);

  --gray100: #f8f9fa;
  --gray200: #e9ecef;
  --gray300: #dee2e6;
  --gray400: #ced4da;
  --gray500: #adb5bd;
  --gray600: #6c757d;
  --gray700: #495057;
  --gray800: #343a40;
  --gray900: #212529;
  /*--bodytop: 56px;*/
  --bodytop: 0px;
}

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
  cursor: pointer;
}

/*************** General ***************/

.bgw {
	background-color: var(--bs-white) !important;
	color: inherit;
}

.bgr {
	background-color: var(--bs-red) !important;
	color: inherit;
}

.bgor {
	background-color: var(--bs-orange) !important;
	color: inherit;
}

.bga {
	background-color: var(--bs-cyan) !important;
	color: inherit;
}

.bgy {
	background-color: var(--bs-yellow) !important;
	color: inherit;
}
 
.bgry {
	background-color: var(--bs-gray) !important;
	color: inherit;
}

.bgrn {
  background-color: var(--bs-green) !important;
  color: inherit;
}


.bgw-10 {
  background-color: var(--white10) !important;
  color: inherit;
}

.bgw-20 {
  background-color: var(--white20) !important;
  color: inherit;
}

.bgw-30 {
  background-color: var(--white30) !important;
  color: inherit;
}

.bgw-40 {
  background-color: var(--white40) !important;
  color: inherit;
}

.bgw-50 {
  background-color: var(--white50) !important;
  color: inherit;
}

.bgw-60 {
  background-color: var(--white60) !important;
  color: inherit;
}

.bgw-70 {
  background-color: var(--white70) !important;
  color: inherit;
}

.bgw-80 {
  background-color: var(--white80) !important;
  color: inherit;
}

.bgw-90 {
  background-color: var(--white90) !important;
  color: inherit;
}

.text-white-10 {
  background-color: inherit;
  color: var(--white10) !important;
}

.text-white-20 {
  background-color: inherit;
  color: var(--white20) !important;
}

.text-white-30 {
  background-color: inherit;
  color: var(--white30) !important;
}

.text-white-40 {
  background-color: inherit;
  color: var(--white40) !important;
}

.text-white-50 {
  background-color: inherit;
  color: var(--white50) !important;
}

.text-white-60 {
  background-color: inherit;
  color: var(--white60) !important;
}

.text-white-70 {
  background-color: inherit;
  color: var(--white70) !important;
}

.text-white-80 {
  background-color: inherit;
  color: var(--white80) !important;
}

.text-white-90 {
  background-color: inherit;
  color: var(--white90) !important;
}



.bgry-100 {
  background-color: var(--gray100) !important;
  color: inherit;
}

.bgry-200 {
  background-color: var(--gray200) !important;
  color: inherit;
}

.bgry-300 {
  background-color: var(--gray300) !important;
  color: inherit;
}

.bgry-400 {
  background-color: var(--gray400) !important;
  color: inherit;
}

.bgry-500 {
  background-color: var(--gray500) !important;
  color: inherit;
}

.bgry-600 {
  background-color: var(--gray600) !important;
  color: inherit;
}

.bgry-700 {
  background-color: var(--gray700) !important;
  color: inherit;
}

.bgry-800 {
  background-color: var(--gray800) !important;
  color: inherit;
}

.bgry-900 {
  background-color: var(--gray900) !important;
  color: inherit;
}

.text-gray-100 {
  background-color: inherit;
  color: var(--bs-gray-100) !important;
}

.text-gray-200 {
  background-color: inherit;
  color: var(--bs-gray-200) !important;
}

.text-gray-300 {
  background-color: inherit;
  color: var(--bs-gray-300) !important;
}

.text-gray-400 {
  background-color: inherit;
  color: var(--bs-gray-400) !important;
}

.text-gray-500 {
  background-color: inherit;
  color: var(--bs-gray-500) !important;
}

.text-gray-600 {
  background-color: inherit;
  color: var(--bs-gray-600) !important;
}

.text-gray-700 {
  background-color: inherit;
  color: var(--bs-gray-700) !important;
}

.text-gray-800 {
  background-color: inherit;
  color: var(--bs-gray-800) !important;
}

.text-gray-900 {
  background-color: inherit;
  color: var(--bs-gray-900) !important;
}


.bg-teal {
  background-color: var(--bs-teal) !important;
  color: inherit;
}

body {
  min-height: 100vh;
  margin-top: var(--bodytop);

  background-color: #430E81;
}

/***** back to top *****/

#back-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 9990; 
  cursor: pointer;
/*  color: rgba(228,29,38,0.35);*/
  color: rgba(255,255,255,0.2)
}

#back-to-top:hover{
/*  color: #e41d26;*/
  color: rgba(255,255,255,0.6);
}


.carousel-item img {
  max-height: 100%;
  width: auto;
}

.bg_ciber{
  min-height: 100vh;
  background-repeat: no-repeat;
  background-image: url(../../img/illustrations/21034637-ai.svg);
}

#particles-js{
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: -1;
}

#cs_comunic .card{
  cursor: pointer;
}

#cs_mod_comunic .modal-content{
  background-color: rgba(67, 14, 129,0.4);
}

#cs_mod_comunic .modal-header{

  border: none;
  backdrop-filter: blur(10px);
  color: #fff;
  font-weight: bolder;
}

#cs_mod_comunic .modal-header button.btn-close{
  color: #fff;
}


#atackcontentchart {
  width: 450px;
  height: auto;
}
