@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,400;0,700;0,900;1,400;1,900&display=swap');
:root{
  --red:#DA1427;
  --red-light:#DB4B53;
  --black:#272727;
  --blue:#1D66D2;
  --c-white: #fff;
  --c-black: #000;
  --gray:#E8E8E8;
  --white-gray:#F5F5F5;
}

.titulo-form { 
  margin-top: 0px;
  padding: 10px 0px;
  background-color: rgb(220, 80, 80);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  color: white;
}
/* login */
.bg {
    background-image: url('../img/bg.jpg');
    width: 100%;
    height: 100%;
}
.mt{
  margin-top:20px;
}
.login-view {
    box-shadow: 0 0px 0px 0px rgba(0,0,0,.2), 0 0px 0px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12);
    background: rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    padding: 40px 70px 40px 70px;
}
.btn-login{
  background: var(--red);
  border-radius: 20px;
  font-family: 'Roboto','sans-serif';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 21px;
  color:#fff;
  text-transform:uppercase;
  height:55px;
}

.d-login .k-input.k-textbox, .d-login .k-textarea, .d-login .k-textbox {
    background-color: var(--red);
    border-width: none;
    border-radius: 5px !important;
    box-shadow: none;
    font-weight: normal;
    font-size: 18px !important;
    color: #fff !important;
    height:40px !important;
}
.login-view ::placeholder{
  color:rgba(255,255,255,0.7);
}

/* Home Loggued */
.top-bar{
  background:var(--red);
  height:115px;
}
.top-logo{
  width:132px;
}
.box-testes{
  border-radius: 10px;
  height:200px;
  overflow:hidden;
  margin:5px 30px 5px 30px;
  display:grid;
  justify-content:center;
  align-items:center;
  width:20%;
}
.nome-teste{
  font-family: 'Roboto', 'sans-serif';
  font-style: normal;
  font-weight: bold;
  font-size: 28px;
  line-height: 33px;
  text-transform: uppercase;
  color:#fff;
}
.qtd-teste{
  font-family:'Roboto','sans-serif';
  font-style: normal;
  font-weight: bold;
  font-size: 36px;
  line-height: 42px;
  text-transform: uppercase;
  color: #FFFFFF;
}
.bg-red{
  background:var(--red);
}
.bg-blue{
   background:var(--blue);
}
.bg-black{
   background:var(--black);
}
/* nav */
.navbar-default {
    background-color: var(--black);
    border-color: var(--black);
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
    color: var(--red);
    background-color: #fff;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover .user-avatar:hover {
   color: var(--red);
    background-color: #fff;
}
.user-avatar:hover {
  color: var(--red);
}

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    color:var(--red);

}
.k-grid-toolbar .k-button {
    color: var(--blue);
}
.k-grid-toolbar .k-button:hover {
    background-color: var(--blue);
}
.k-grid-header .k-header {
    background-color: var(--blue);
   
}
.k-grid-header .k-header:hover, .k-grid-header .k-header:hover a {
    color: var(--black) !important;
}
.k-pager-wrap .k-state-selected {
    color: #fff;
    background-color: var(--blue);
}
.k-pager-wrap a.k-pager-refresh {
    color: var(--blue);
}
.k-pager-wrap a.k-pager-refresh:hover {
    background-color: var(--blue);
    color: #ffffff;
}
.nav-tabs {
    background: var(--red-light);
    border-bottom: 2px solid var(--red);
    height: 100%;
}
.nav.nav-tabs li.active {
    background-color: var(--red);
}


.style1431 { 
  background-color: rgb(218, 20, 39); 
}

.style1045 { 
  border-color: red;
}

.style6745 { 
  color: rgb(218, 20, 39);
}

.painel-notificacao {
    border-color: var(--blue); 
}

.painel-notificacao :hover{
    background-color: var(--blue); 
    color: white !important;
}

.btn-fab {
    margin:5px !important;
}

.loader {
    width: 48px;
    height: 48px;
    border: 5px solid #000;
    border-bottom-color: #FF3D00;
    border-radius: 50%;
    /* display: inline-block;
    box-sizing: border-box; */
    animation: rotation 1s linear infinite;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 10;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
} 

.card {
    display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	flex-wrap: wrap;
	justify-content: center;
    border: 1px solid var(--gray);
	border-radius: 16px;
	box-shadow: 0 30px 30px -25px rgba(#4133B7, .25);
	max-width: 300px;
    background-color: var(--white-gray);
	padding: 1.5rem;
    margin-bottom:10px;
    height:270px;
}
.card p{
    overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3; 
-webkit-box-orient: vertical; 
}
.card h2{
    overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2; 
-webkit-box-orient: vertical; 
}
.button-ajuda {
		font: inherit;
		line-height: 1;
		background-color: var(--red-light);
		border: 2px solid var(--red);
		color: var(--c-white);
		padding: 0.5em 1em;
		border-radius: 6px;
		font-weight: 500;
		display: inline-flex;
		align-items: center;
		justify-content: space-between;
		
	}
.button-ajuda:hover{
    background-color: var(--red);
			color: var(--c-white);
}
