    .bandeira {
        margin-bottom: -6px;
        padding: 2px !important;
        font-weight: 700;
        text-align: center !important;
        border-radius: 10px;
        color: #000000;
        list-style: none outside;
        word-wrap: break-word;
        font-size: 13px !important;
        text-shadow: 1px 1px 0 #1eff00;
        width: 100%;
        margin-top: -13px;
    }
     #resend-message.disabled {
            color: red; /* Muda a cor do texto para vermelho */
            pointer-events: none; /* Impede a interação com o elemento */
            opacity: 0.5; /* Torna o elemento semi-transparente */
            font-weight: 600;
            text-shadow: 1px 1px 0 #ffffff; /* Adiciona uma sombra ao texto */
        }
         #resend-message{
            color: #000000;
            cursor: pointer;
            padding: 0px 5px 5px 5px;
            margin-top: 3px;
            font-weight: 600;
       	}
        #resend-message:hover{
        	color: #0000ff;
        }
    #login-message{
        font-size: 13px !important;
    }
    /* Estilo básico para o botão */
    #infobutton {
        color: #ff0000 !important;
        cursor: pointer;
        font-size: 14px !important;
        margin: auto;
        font-weight: 800 !important;
        display: block;
    }

    #infobutton:hover {
        color: #000 !important;
    }
    /* Estilo básico para o modal */
    .modal {
        display: none; /* Escondido por padrão */
        position: fixed; /* Fica em cima da tela */
        z-index: 1; /* Fica na frente */
        left: 0;
        top: 0;
        width: 100%; /* Largura total */
        height: 100%; /* Altura total */
        overflow: auto; /* Habilita rolagem se necessário */
        background-color: rgba(0,0,0,0.4); /* Fundo com transparência */
    }

    /* Estilo do conteúdo do modal */
    .modal-content {
        background-color: #fff1f1;
        margin: 15px auto;
        padding: 15px 2px 10px 25px;
        border: 2px solid #0c0c0c;
        width: 30%;
        border-radius: 7px;
        text-align: left;
        box-shadow: 0px 3px 9px 3px rgb(0 0 0) !important;
    }
    /* Estilos específicos para dispositivos móveis */
    @media (max-width: 768px) { /* Ajuste a largura conforme necessário */
        .modal-content {
            width: 90%; /* Largura do modal em dispositivos móveis */
            padding: 10px; /* Ajuste o padding para dispositivos móveis */
            border-radius: 5px; /* Ajuste o border-radius se necessário */
            box-shadow: 0px 3px 9px 3px rgb(0 0 0) !important;
        }
    }
    /* Estilos específicos para dispositivos móveis */
    @media (max-width: 480px) { /* Ajuste a largura conforme necessário */
        .modal-content {
            width: 75%; /* Largura do modal em dispositivos móveis */
            padding: 15px 2px 10px 25px; /* Ajuste o padding para dispositivos móveis */
            border-radius: 5px; /* Ajuste o border-radius se necessário */
            box-shadow: 0px 3px 9px 3px rgb(0 0 0) !important;
        }
    }

    /* Estilo do botão de fechar */
    .close {
        color: #04ff00;
        float: right;
        font-size: 35px;
        font-weight: bold;
        padding: 0px 2px;
    }

    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }
    h2 {
        font-size: 15px;
        text-align: center;
        font-weight: 600;
        color: blue;
        text-decoration: underline;
    }
    
    .flag {
        width: 30px; /* Tamanho da bandeira */
        height: auto;
        margin-right: 10px; /* Espaçamento entre a bandeira e o campo */
        border-radius: 3px;
    }
    #ip-container {
        display: flex;
        align-items: center;
        margin-bottom: 3px;
        justify-content: center;
        margin-top: 10px;
    }
    #statuslocal {
    font-size: 12px;
    margin-bottom: 7px;
    color: #333; /* Cor do texto */
}
    
    /* Estilo para a mensagem de erro */
    #errormessage {
        background-color: #fffff0 !important;
        padding: 2px !important;
        font-weight: 700;
        border: 2px solid #f7f3f7 !important;
        box-shadow: 5px 5px 0px 0 rgb(0 0 0 / 45%) !important;
        text-align: center !important;
        border-radius: 10px;
        margin: 10px 0px 5px 0px;
        color: #ff0000;
        list-style: none outside;
        word-wrap: break-word;
        font-size: 15px !important;
        text-shadow: 1px 1px 0 #1eff00;
    }
    .status {
        margin-bottom: 7px;
        background-color: #ffffff08 !important;
        padding: 2px !important;
        font-weight: 700;
        box-shadow: 3px 4px 0px 0 rgb(0 0 0 / 45%) !important;
        text-align: center !important;
        border-radius: 10px;
        color: #000000;
        border-top: 4px solid #6a028b;
        list-style: none outside;
        word-wrap: break-word;
        font-size: 13px !important;
        text-shadow: 1px 1px 0 #1eff00;
    }
    .notice, .notice-error, .message, .login .success {
    padding: 1px !important;
    font-weight: 700;
    margin: 10px 0px 0px 0px;
    color: #0000ff;
    list-style: none outside;
    word-wrap: break-word;
    font-size: 15px !important;
    text-shadow: 1px 1px 0 #1eff00;
    }
    .login .message,
    .login .notice,
    .login .success {
	 background-color: #ffffff00; 
     box-shadow: 0 1px 1px 0 rgb(0 0 0 / 0%);
    }
    
   #login_error, .error {
        background-color: #fffff0 !important;
        padding: 2px !important;
        font-weight: 700;
        border: 2px solid #f7f3f7 !important;
        box-shadow: 5px 5px 0px 0 rgb(0 0 0 / 45%) !important;
        text-align: center !important;
        border-radius: 10px;
        margin: 10px 0px 5px 0px;
        color: #ff0000;
        list-style: none outside;
        word-wrap: break-word;
        font-size: 15px !important;
        text-shadow: 1px 1px 0 #1eff00;
    }
    .login form .input, .login input[type="text"], .login input[type="password"] {
     margin: 0 6px 6px 0;
    }
    input[type="checkbox"], input[type="radio"] {
    border: 1px solid #0646b1;
    }
    
     @media only screen and (max-width: 768px) { 
    body.login #nav a,
    #backtoblog a {
        font-weight: 700 !important;
        font-size: 13px !important;
        font-family: "Roboto", Times, serif; 
    }
}
