body{
  background: #fff;
}
.navbar, .dropdown-menu{
background:#09ba32;
border: none;
}

.nav>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .dropdown-menu>li>a, .dropdown-menu>li{
border-bottom: 3px solid transparent;
}
.nav>li>a:focus, .nav>li>a:hover,.nav .open>a, .nav .open>a:focus, .nav .open>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
border-bottom: 3px solid transparent;
background: rgba(154, 154, 154, 0.27);
}
.navbar a, .dropdown-menu>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .navbar-toggle{
color: #fff;
}
.dropdown-menu{
    -webkit-box-shadow: none;
  box-shadow:none;
}

.nav li:hover:nth-child(8n+1), .nav li.active:nth-child(8n+1){
border-bottom: #b6f423 4px solid;
}
.nav li:hover:nth-child(8n+2), .nav li.active:nth-child(8n+2){
border-bottom: #82e2ea 4px solid;
}
.nav li:hover:nth-child(8n+3), .nav li.active:nth-child(8n+3){
border-bottom: #f8b42c 4px solid;
}
.nav li:hover:nth-child(8n+4), .nav li.active:nth-child(8n+4){
border-bottom: #fd594a 4px solid;
}
.nav li:hover:nth-child(8n+5), .nav li.active:nth-child(8n+5){
border-bottom: #e8479d 4px solid;
}
.nav li:hover:nth-child(8n+6), .nav li.active:nth-child(8n+6){
border-bottom: #a12eeb 4px solid;
}
.nav li:hover:nth-child(8n+7), .nav li.active:nth-child(8n+7){
border-bottom: #4785d9 4px solid;
}
.nav li:hover:nth-child(8n+8), .nav li.active:nth-child(8n+8){
border-bottom: #2aed9a 4px solid;
}

.navbar-toggle .icon-bar{
  color: #fff;
  background: #000000;
}

/* Credit to bootsnipp.com for the css for the color graph 
ESTO SOLO ES PARA EL FORMULARIO DE LOGIN
*/
.colorgraph {
height: 5px;
border-top: 0;
background: #c4e17f;
border-radius: 5px;
background-image: -webkit-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: -moz-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: -o-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: linear-gradient(to right, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
}

.color-input{
background-color: #ffffff;
}

html, body {
height: 100%;
margin: 0;
}

#wrapper {
display: flex;
flex-direction: column;
height: 100%;
}

#content-wrapper {
display: flex;
flex-direction: column;
flex-grow: 1;
}

#content {
flex-grow: 1;
}

footer {
margin-top: auto;
}

.carousel-inner .container-announcement,
.carousel-inner .container-experience {
  max-width: 90%; /* Haz que ocupen más espacio horizontal */
  margin: auto;
  padding: 15px; /* Reduce el padding interno */
  background-color: #f9f9f9;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.carousel-item.div-container{
transition: transform 0.15s ease-in-out, opacity 0.15s ease-in-out; /* Transición más rápida */
}

/* Estilo general para el botón de copiar enlace (más pequeño) */
#copy-link-btn {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 5px;
font-size: 14px; /* Tamaño de fuente más pequeño */
background-color: #285f18;
color: white;
padding: 8px 15px; /* Espaciado reducido */
border-radius: 25px; /* Bordes más pequeños */
cursor: pointer;
border: 2px solid #285f18;
text-transform: uppercase;
font-weight: bold;
transition: all 0.3s ease;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Cambios en el botón cuando se pasa el cursor */
#copy-link-btn:hover {
background-color: #4d7b30;
color: #fff;
transform: translateY(-2px);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

/* Efecto de enfoque (cuando se hace clic) */
#copy-link-btn:focus {
outline: none;
box-shadow: 0 0 0 3px rgba(41, 95, 24, 0.4);
}

/* Estilo del ícono dentro del botón */
#copy-link-btn i {
margin-right: 8px; /* Menos margen entre el ícono y el texto */
font-size: 16px; /* Ícono más pequeño */
}

/* Estilo del texto del botón */
#copy-link-btn span {
font-size: 14px; /* Texto más pequeño */
font-weight: 600;
}

/* Estilos Biblioteca */

.card {
    margin-top: 20px;
}

.card-header {
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
}

.list-group-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Carpetas y documentos */
.folder-item,
.document-item {
    text-align: center;
    margin: 15px 0;
    cursor: pointer;
    padding: 10px;
    margin-bottom: 10px;
    position: relative;
}

/* Íconos */
.folder-item i {
    font-size: 100px;
    color: #51AD32;
    display: block;
    margin-bottom: 10px;
}

.document-item i {
    font-size: 50px;
    color: #51AD32;
    display: block;
    margin-bottom: 10px;
}

/* Texto (nombre) */
.folder-item a,
.document-item a {
    font-size: 16px;
    color: #333;
    text-decoration: none;
}

.folder-item a:hover,
.document-item a:hover {
    text-decoration: underline;
}

/* Selección */
.selected {
    border: 2px solid #51ad32;
    border-radius: 10px;
    background-color: #f2fff2;
}

/* Estilo general para todos los botones de eliminación */
.delete-btn {
    display: none;
    position: absolute;
    cursor: pointer;
    border: none;
    font-weight: bold;
    padding: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 25px;
    line-height: 22px;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.9);
    color: #dc3545;
}

.resource-item.file .delete-btn i,
.resource-item.document-item .delete-btn i {
    font-size: 20px;
}

.delete-btn i {
    font-size: 12px;
}

/* Archivos y documentos */
.resource-item.file .delete-btn,
.resource-item.document-item .delete-btn {
    top: 4px;
    right: 6px;
}

/* Carpetas */
.resource-item.folder .delete-btn {
    top: -6px;
    right: -6px;
    width: 18px;
    height: 18px;
    font-size: 10px;
    line-height: 18px;
    background-color: #dc3545;
    color: white; /* Color del texto del botón */
}


.resource-item.folder .delete-btn i {
    color: white !important;
    font-size: 17px !important;
    margin-top: 8px !important;
}

/* Mostrar solo cuando está seleccionado */
.resource-item.selected .delete-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}