:root {
    --primary-color: #3f55a5;
    --primary-dark-color: #0a2d82;
    --secondary-color: #2846d2;
    --secondary-color-ligth: #25a9e6;
    --text-color: #ffff;
    --nav-bar-height: 60px;
}

/*--------------- fontes -----------------*/


@font-face {
    font-family: "Roboto";    
    src: url("../fonts/Roboto-Regular.ttf") format('truetype');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: "Roboto bold";    
    src: url("../fonts/Roboto-Bold.ttf") format('truetype');
    font-weight: bold;
    font-style: normal;
}


@font-face {
    font-family: "Estricta";
    src: url("../fonts/Estricta-Regular.ttf") format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Estricta bold";
    src: url("../fonts/Estricta-Bold.ttf") format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "Estricta bold italic";
    src: url("../fonts/Estricta-BoldItalic.ttf") format('truetype');
    font-weight: bold;
    font-style: italic;
}


body
{
	font-family: "Estricta", 'Estricta bold', 'Estricta bold italic';
}

.bold
{	
	font-weight: bold;
}

/*-------------- Cor principal -----------------*/

.principal-bg {
    background-color: var(--primary-color) !important;
}

.principal-hover:hover {
    background-color: #2846d2 !important;
    cursor: pointer;
}

.principal-text {
    color: #ffff !important;
    font-family: 'Estricta';
}

.principal-bold {
    border-color: #3f55a5 !important;
}

/*--------------- Cor secundária ---------------*/

.secondary-bg
{
	background-color: #2846d2 !important;
}

.secondary-hover:hover
{
	background-color: #274b7d !important;
	cursor: pointer;
}

.secondary-text {
    color: #ffff !important;
    font-family: 'Roboto' ,'Roboto bold';    
}

.secondary-text-hover:hover
{
	color: #274b7d !important;
}

.secundary-bold
{
	border-color: #002e6e !important;
}


/*-------------- Customização do Tema para o Cliente -----------------*/

/*Os parametros abaixo permitem personalizar os elementos da Barra Superior, espaço do usuário e a cor especifica dos simbolos de status*/

.top-bar
{
    /*Paramêtros para editar a barra superior do site*/
    /*
	background: linear-gradient(to bottom, #000000 60%,#FFFFFF 100%) !important;
    */

    /*Borda da Barra Superior*/
    /*
    border: none;
    */

    /*Altura da Barra Superior*/
    /*
    height: 90px;
    */
}

.logo-box
{
    /*Paramêtros para editar a caixa onde está localizada a imgem do logo*/
    /*
    border: none;
    */
}

.logo
{
    /*Paramêtros para inserir a url da imagem do logo do cliente 
    e permite outras alterações neste item*/
	
    background-image: url(../img/logo_cliente.png);

    
    /*Tamanho da Imagem*/
    /*
    width: 0px; 
    height: 0px;
    */

    /*Tamanho da Imagem*/
    /*
    margin-right: opx;
    margin-left: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    */
}

.active.bar, .active.circle
{
    /*Parametros para alterar a cor dos Circulos e icones de Status*/
    /*
    background-color: #000000 !important;
    */
}

.positive-text
{
    /*Parametros para alterar a cor dos icones de status no modo responsivo*/
    /*color: #000000 !important;*/
}

.user .dropdown-toggle
{
    /*Parametros para alterar a cor dos icones de status no modo responsivo*/

    /*Altura da Linha na caixa do usuário*/
    /*
    line-height: 55px;
    */
}