/* GUIA */
.EspaçoGuia{
    margin-left: 5px;
    font-family: Arial, sans-serif;
} 

.espacoTabelaProcura{
    padding-left: 50px;
}
table {
    background-color: lightgrey;
    margin: auto;
    width: 70%;
    border-collapse: collapse;
    text-align: center;
}

.linha_tabela {
    border: 1px grey;
    border-style: dotted;
    border-top: transparent;
    border-left: transparent;
    border-right: transparent;
    padding: 8px;
    text-align: center;
    font-family: Arial, sans-serif;
}



.CorBotaoAzulGuia{
    background: linear-gradient(to bottom, #6699ff 0%, #0066ff 100%);
    margin: 5px;
    color:white; 
    width:14.5%; 
    height:7%; 
    font-size:22; 
    border-radius:10px;
    position: absolute;
    left:84.5%;
    display: block;
    top:10%;
}
.CorBotaoVerdeGuia{
    background: linear-gradient(to bottom, #00ff00 0%, #009900 100%);
    margin: 5px;
    color:white; 
    width:14.5%; 
    height:7%; 
    font-size:22; 
    border-radius:10px; 
    position: absolute;
    display: block;
    top:91%;
    left: 0.7%;
    font-weight: normal;
}
.CorBotaoLaranjaGuia{
    background: linear-gradient(to bottom, #ff9900 0%, #996600 100%);
    margin: 5px;
    color:white; 
    width:14.5%; 
    height:7%; 
    font-size:22; 
    border-radius:10px;
    position: absolute;
    left:16.5%;
    display: block;
    top:91%;
    font-weight: normal;
}
.botoesGuiaTratamento{
    display: flex; 
    align-items: center; 
    transform: scale(1.1); 
    padding: 10px;
}
.tamanhoBotaoGuia{
    width: 20;
    height: 25px;
}
.infGuia{
    font-size:17;
    color: black;
    font-family: Arial, sans-serif; 
    position: absolute;
    display: block;
    top:10.5%;
    left: 1%;
    font-weight: normal;
}
.botaoComLinkSemDecoracaoGuia{
    color: white; 
    text-decoration:none;
}
.linhaBotoesGuia {
    display: inline-flex;
    padding-bottom: 2%;
    position: absolute;
    top:14%;
    left: 0.7%;
    font-weight: normal;
}
/* Guia Tratamento Numero*/
.desativadoGuiaNumero{
    border: none; 
    border-bottom: 2px solid black; 
    padding-bottom: 5px; 
    outline: none;
    background-color: white;
    margin:5 10px;
    display: none;
}
.ativadoGuiaNumero, 
.ativadoGuiaNumero:disabled{
    border: none; 
    border-bottom: 2px solid black; 
    padding-bottom: 5px;  
    outline: none;
    background-color: white;
    margin:5 10px;
    display: block;
}
.ativadoGuiaNumero:focus {
    border-bottom-color: red;
}
.tamanhoBotaoGuia:hover{
    cursor: pointer;
}
button:hover{
    cursor: pointer;
}

@media screen and (max-width: 800px){
/* GUIA */
.EspaçoGuia{
    margin-left: 5px;
    font-family: Arial, sans-serif;
} 
.CorBotaoAzulGuia{
    background: linear-gradient(to bottom, #6699ff 0%, #0066ff 100%);
    margin: 5px;
    color:white; 
    width:20.5%; 
    height:7%; 
    font-size:22; 
    border-radius:10px;
    position: absolute;
    left:77%;
    display: block;
    top:10%;
} 
.CorBotaoVerdeGuia{
    background: linear-gradient(to bottom, #00ff00 0%, #009900 100%);
    margin: 5px;
    color:white; 
    width:23.5%; 
    height:7%; 
    font-size:22; 
    border-radius:10px; 
    position: absolute;
    display: block;
    top:91%;
    left: 0.7%;
    font-weight: normal;
}
.CorBotaoLaranjaGuia{
    background: linear-gradient(to bottom, #ff9900 0%, #996600 100%);
    margin: 5px;
    color:white; 
    width:23.5%; 
    height:7%; 
    font-size:22; 
    border-radius:10px;
    position: absolute;
    left:26.5%;
    display: block;
    top:91%;
    font-weight: normal;
}
.botoesGuiaTratamento{
    display: flex; 
    align-items: center; 
    transform: scale(1.1); 
    padding: 10px;
}
.tamanhoBotaoGuia{
    width: 20;
    height: 25px;
}
.infGuia{ 
    font-size:17;
    color: black;
    font-family: Arial, sans-serif; 
    position: absolute;
    display: block;
    top:10.5%;
    left: 1%;
    font-weight: normal;
}
.botaoComLinkSemDecoracaoGuia{
    color: white; 
    text-decoration:none;
}
.linhaBotoesGuia {
    display: inline-flex;
    padding-bottom: 2%;
    position: absolute;
    top:14%;
    left: 0.7%;
    font-weight: normal;
}
/* Guia Tratamento Numero*/
.desativadoGuiaNumero{
    border: none; 
    border-bottom: 2px solid black; 
    padding-bottom: 5px; 
    outline: none;
    background-color: white;
    margin:5 10px;
    display: none;
}
.ativadoGuiaNumero, 
.ativadoGuiaNumero:disabled{
    border: none; 
    border-bottom: 2px solid black; 
    padding-bottom: 5px;  
    outline: none;
    background-color: white;
    margin:5 10px;
    display: block;
}
.ativadoGuiaNumero:focus {
    border-bottom-color: red;
}
.tamanhoBotaoGuia:hover{
    cursor: pointer;
}
button:hover{
    cursor: pointer;
}
}

@media screen and (min-width:801px) and (max-width: 1000px){
    .EspaçoGuia{
        margin-left: 5px;
        font-family: Arial, sans-serif;
    } 
    .CorBotaoAzulGuia{
        background: linear-gradient(to bottom, #6699ff 0%, #0066ff 100%);
        margin: 5px;
        color:white; 
        width:20.5%; 
        height:5%; 
        font-size:22; 
        border-radius:10px;
        position: absolute;
        left:77%;
        display: block;
        top:4%;
    } 
    .CorBotaoVerdeGuia{
        background: linear-gradient(to bottom, #00ff00 0%, #009900 100%);
        margin: 5px;
        color:white; 
        width:23.5%; 
        height:5%; 
        font-size:22; 
        border-radius:10px; 
        position: absolute;
        display: block;
        top:94%;
        left: 0.7%;
        font-weight: normal;
    }
    .CorBotaoLaranjaGuia{
        background: linear-gradient(to bottom, #ff9900 0%, #996600 100%);
        margin: 5px;
        color:white; 
        width:23.5%; 
        height:5%; 
        font-size:22; 
        border-radius:10px;
        position: absolute;
        left:26.5%;
        display: block;
        top:94%;
        font-weight: normal;
    }
    .botoesGuiaTratamento{
        display: flex; 
        align-items: center; 
        transform: scale(1.1); 
        padding: 10px;
    }
    .tamanhoBotaoGuia{
        width: 20;
        height: 25px;
    }
    .infGuia{ 
        font-size:17;
        color: black;
        font-family: Arial, sans-serif; 
        position: absolute;
        display: block;
        top:10.5%;
        left: 1%;
        font-weight: normal;
    }
    .botaoComLinkSemDecoracaoGuia{
        color: white; 
        text-decoration:none;
    }
    .linhaBotoesGuia {
        display: inline-flex;
        padding-bottom: 2%;
        position: absolute;
        top:14%;
        left: 0.7%;
        font-weight: normal;
    }
    /* Guia Tratamento Numero*/
    .desativadoGuiaNumero{
        border: none; 
        border-bottom: 2px solid black; 
        padding-bottom: 5px; 
        outline: none;
        background-color: white;
        margin:5 10px;
        display: none;
    }
    .ativadoGuiaNumero, 
    .ativadoGuiaNumero:disabled{
        border: none; 
        border-bottom: 2px solid black; 
        padding-bottom: 5px;  
        outline: none;
        background-color: white;
        margin:5 10px;
        display: block;
    }
    .ativadoGuiaNumero:focus {
        border-bottom-color: red;
    }
    .tamanhoBotaoGuia:hover{
        cursor: pointer;
    }
    button:hover{
        cursor: pointer;
    }
}

@media screen and (min-width:1201px) and (max-width:1400px){
    .CorBotaoAzulGuia{
        background: linear-gradient(to bottom, #6699ff 0%, #0066ff 100%);
        margin: 5px;
        color:white; 
        width:20.5%; 
        height:8%; 
        font-size:22; 
        border-radius:10px;
        position: absolute;
        left:78.5%;
        display: block;
        top:10%;
    } 
    .CorBotaoVerdeGuia{
        background: linear-gradient(to bottom, #00ff00 0%, #009900 100%);
        margin: 5px;
        color:white; 
        width:14.5%; 
        height:8%; 
        font-size:22; 
        border-radius:10px; 
        position: absolute;
        display: block;
        top:91%;
        left: 0.7%;
        font-weight: normal;
    }
    .CorBotaoLaranjaGuia{
        background: linear-gradient(to bottom, #ff9900 0%, #996600 100%);
        margin: 5px;
        color:white; 
        width:14.5%; 
        height:8%; 
        font-size:22; 
        border-radius:10px;
        position: absolute;
        left:16.5%;
        display: block;
        top:91%;
        font-weight: normal;
    }
}