@font-face {
    font-family:"Final Six Medium";
    src: url("../fonts/otf/fonnts.com-FinalSix_Medium.otf");
  }

  @font-face {
    font-family:"Final Six Heavy";
    src: url("../fonts/otf/fonnts.com-FinalSix_Heavy.otf");
  }

  @font-face {
    font-family:"Final Six Book";
    src: url("../fonts/otf/fonnts.com-FinalSix_Book.otf");
  }

  @font-face {
    font-family:"Final Six Extra Bold";
    src: url("../fonts/otf/fonnts.com-FinalSix_ExtraBold.otf");
  }

	.bordes {		
		font-family: "Final Six Medium";
		font-size: 20px;
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #21349c;
		background-color: #ffffff;
		color: #21349c;
		text-align:center;
	}
	.bordes-btn {		
		font-family: "Final Six Extra Bold";
		font-size: 20px;
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #00cfc2;
		background-color: #00cfc2;
		color: #ffffff;
		text-align:center;
		height: 68px;
	}
	.bordes-btn:hover,
	.bordes-btn:active,
	.bordes-btn:focus{		
		font-family: "Final Six Extra Bold";
		font-size: 20px;
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #00cfc2;
		background-color: #FFFFFF;
		color: #00cfc2;
		text-align:center;
	}
	
	.bordes-btn-sm {		
		font-family: "Final Six Extra Bold";
		font-size: 15px;
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #00cfc2;
		background-color: #00cfc2;
		color: #ffffff;
		text-align:center;
		height: 40px;
	}
	
	.bordes-btn-sm:hover,
	.bordes-btn-sm:active,
	.bordes-btn-sm:focus{		
		font-family: "Final Six Extra Bold";
		font-size: 15px;
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #00cfc2;
		background-color: #FFFFFF;
		color: #00cfc2;
		text-align:center;
	}	

	.bordes-titulo {	
		font-family: "Final Six Book";
		font-size: 40px;	
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #21349c;
		background-color: #21349c;
		color: #ffffff;
		text-align:center;
	}

	.bordes-input {	
		font-family: "Final Six Book";
		font-size: 25px;	
		border-radius: 0px 30px 0px 30px;
		border: 3px solid #21349c;
		background-color: #ffffff;
		color: #21349c;
		text-align:center;
		height: 68px;
	}
	
	
	.bordes-input-sm {	
		font-family: "Final Six Book";
		font-size: 15px;	
		border-radius: 0px 0px 0px 0px;
		border:0px;
		border-bottom: 2px solid #21349c;
		background-color: #ffffff;
		color: #21349c;
		text-align:left;
		height: 40px;
		width: 100%;
		padding-left: 20px;
		margin-left: 10px;
		margin-right: 10px;
	}
	
	.bordes-card-header {		
		font-family: "Final Six Extra Bold";
		font-size: 20px;
		border-radius: 0px 30px 0px 0px;
		border: 3px solid #21349c;
		border-bottom : 0px;
		background-color: #ffffff;
		color: #21349c;
		text-align:left;
		padding-left: 20px;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.bordes-card-body {		
		font-family: "Final Six Medium";
		font-size: 15px;
		border-radius: 0px 0px 0px 30px;
		border: 3px solid #21349c;
		border-top : 0px;
		background-color: #e3e6f4;
		color:  #21349c;
		text-align:left;
		padding-left: 20px;
		padding-top: 20px;
		padding-bottom: 20px;
	}
		
	.bordes-table-body {		
		font-family: "Final Six Medium";
		font-size: 15px;
		border-radius: 0px 0px 0px 0px;
		border: 3px solid #21349c;		
		border-bottom : 0px;
		background-color: #e3e6f4;
		color:  #21349c;
		text-align:left;
		padding-left: 20px;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.bordes-table-footer {		
		font-family: "Final Six Medium";
		font-size: 15px;
		border-radius: 0px 0px 0px 30px;
		border: 3px solid #21349c;
		border-top : 0px;
		background-color: #ffffff;
		color:  #21349c;
		text-align:left;
		padding-left: 20px;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.item-lista {
	  display: flex;        
	  align-items: center;  
	  gap: 15px;            
	}

	@media (max-width: 600px) {
	  .item-lista {
	    flex-direction: column;
	    text-align: center;    
	  	display: inline;
	  }
	}

	.circulo {	
		font-family: "Final Six Extra Bold";
		width: 40px; 
	  height: 40px; 
	  flex-shrink: 0;
	  border-radius: 50%;
	  background-color: #00cfc2;
	  color: white;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  font-weight: bolder;
	  font-size: 25px;
	}    
	
	/*clases para autocompletar email*/
	
	.input-wrapper {
        position: relative;
        width: 350px;
    }

    .emailInput {
        width: 100%;
        padding: 12px 15px;
        font-size: 16px;
        border: 2px solid #ddd;
        border-radius: 8px;
        outline: none;
        box-sizing: border-box;
    }

    .custom-suggestions {
        list-style: none;
        padding: 0;
        margin: 5px 0 0 0;
        position: relative;
        width: 100%;
        background: white;
        border: 1px solid #ddd;
        border-radius: 8px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.1);
        max-height: 200px;
        overflow-y: auto;
        z-index: 1000;
        display: none; /* Oculto por defecto */
    }

    .custom-suggestions li {
        padding: 10px 15px;
        cursor: pointer;
        color: #333;
        border-bottom: 1px solid #f0f0f0;
    }

    .custom-suggestions li:hover, 
    .custom-suggestions li.active {
        background-color: #EDF8FF;
        color: #336699;
        font-weight: 500;
    }  
	
	/*fin clases para autocompletar email*/