.start-font-size{
    font-size: 27px;
}
.bg-blue{
    background: linear-gradient(0deg, rgba(13,110,253,1) 29%, rgba(213,253,255,1) 100%);
}
.bg-purple{
    background: rgba(215,90,222,1);
}
.bg-pink{
	background: linear-gradient(90deg, rgba(255,93,168,1) 29%, rgb(255, 69, 69) 100%);
}
.bg-color-main{
	background-color: #000011;
}
.bg-orange{
    background-color: #FF8B75;
}
.bg-yellow{
	background-color:#FFC459;
}
.bg-light-yellow{
    background-color: #F9F871;
}
/** ----------------------------------- 
 	 Sidebar Menu
	-------------------------------**/
/* Menu.css */

/* Estilos del botón que abre el offcanvas */

  /* Menu Buttons */
  .custom-btn {
	border: none;
	background-color: #2c2c2c;
	font-weight: 500;
	border-radius: 0.25rem;
	padding: 0.75rem 1rem;
	transition: background-color 0.2s ease-in-out;
  }
  
  .custom-btn:hover {
	background-color: #000011;
  }
  
  .custom-btn i {
	font-size: 1rem;
  }
  
  /* Offcanvas header */
  .offcanvas-header {
	background-color: #000011;
  }
  
  .nav-item .btn {
	text-align: left;
  }
  
  .btn-close-white {
	filter: invert(1);
  }
  
/* ------------------------------- */
/* Bento Grid Section */
/* ------------------------------- */

.bento-item {
    height: 200px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease;
}

.bento-item:hover {
    transform: scale(1.05);
}

.bento-tall {
    height: 410px;
}

.bento-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px;
    background: rgba(0, 0, 0, 0.6);
    color: white;
}

.bento-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/** ------------------------------- 
 	 Custom Buttons 
    ------------------------------- **/
.myButton-purple{
	box-shadow:inset 0px 0px 0px 0px #e184f3;
	background:linear-gradient(to bottom, #D75ADE 5%, #a20dbd 100%);
	background-color:#D75ADE;
	border-radius:42px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:15px;
	font-weight:bold;
	padding: 2px 24px;
	text-decoration:none;
	text-shadow:0px 0px 0px #9b14b3;
}
.myButton-purple:hover{
    color: #ffffff;
	background:linear-gradient(to bottom, #a20dbd 5%, #c123de 100%);
	background-color:#a20dbd;
}
.myButton-purple:active{
    color: #ffffff !important;
	position:relative;
	top:1px;
}
.myButton-primary{
	box-shadow:inset 0px 0px 0px 0px #0dcaf0;
	background:linear-gradient(to bottom, #0dcaf0 5%, #0D6EFD 100%);
	background-color:#0D6EFD;
	border-radius:42px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:15px;
	font-weight:bold;
	padding: 2px 24px;
	text-decoration:none;
	text-shadow:0px 0px 0px #0D6EFD;
}
.myButton-primary:hover{
    color: #ffffff;
	background:linear-gradient(to bottom, #0D6EFD 5%, #0dcaf0 100%);
	background-color:#0D6EFD;
}
.myButton-primary:active{
    color: #ffffff !important;
	position:relative;
	top:1px;
}
.myButton-yellow{
	box-shadow:inset 0px 0px 0px 0px #F9F871;
	background:linear-gradient(to bottom, rgb(250, 203, 102) 5%, #fca910 100%);
	background-color:#FFC459;
	border-radius:42px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:15px;
	font-weight:bold;
	padding: 2px 24px;
	text-decoration:none;
	text-shadow:0px 0px 0px #FFC459;
}
.myButton-yellow:hover{
    color: #ffffff;
	background:linear-gradient(to bottom, #FFC459 5%, #FFC459 100%);
	background-color:#FFC459;
}
.myButton-yellow:active{
    color: #ffffff !important;
	position:relative;
	top:1px;
}
.myButton-danger{
	box-shadow:inset 0px 0px 0px 0px #e184f3;
	background:linear-gradient(to bottom, #FF5DA8 5%, #fd0000 100%);
	background-color:#fd0000;
	border-radius:42px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:15px;
	font-weight:bold;
	padding: 2px 24px;
	text-decoration:none;
	text-shadow:0px 0px 0px #fd0000;
}
.myButton-danger:hover{
    color: #ffffff;
	background:linear-gradient(to bottom, #fd0000 5%, #FF5DA8 100%);
	background-color:#FF5DA8;
}
.myButton-danger:active{
    color: #ffffff !important;
	position:relative;
	top:1px;
}
.myButton-success{
	background:linear-gradient(to top, #009a2e 5%, #73f971 100%);
	border-radius:42px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:15px;
	font-weight:light;
	padding: 2px 24px;
	text-decoration:none;
}
.myButton-success:hover{
	color: #ffffff;	
	background:linear-gradient(to bottom,  #009a2e 5%, #73f971 100%);
	background-color:#f9f871;
}
.myButton-success:active{
	color: #ffffff !important;
	position:relative;
	top:1px;
}