@font-face {
	font-family: Varela;
	src: URL("../content/fonts/Varela.ttf");
}

@font-face {
	font-family: Helvetica;
	src: URL('../content/fonts/Helvetica.ttf');
}

@font-face {
	font-family: Oswald;
	src: URL('../content/fonts/Oswald.ttf');
}

@font-face {
	font-family: Oswald-Bold;
	src: URL('../content/fonts/Oswald-Bold.ttf');
}

* {
	box-sizing: border-box;
}

body {
	margin:0 auto;
	font-family: Varela, Helvetica, Oswald;
	background:#dddddd;
	font-size:13px;
	color: #434343;
}

.clearfix {
	float:none !important;
	clear:both !important;
	width:100%;
	display:block;
}


.wrapper {
	width: fit-content;
    margin: auto;
}

.opaque { opacity: 0.5; }
.remove { display:none !important; }

.desktop { display: block; }
.mobile  { display: none;  }

#main_message {
	position:fixed;
	max-width:400px;
	top:90px;
	right:-300px;
	transition:all 0.5s;
	z-index:999999;
}
#main_message b {
	font-size:14px;
	line-height:2;
}
.move_main_message {
	right:40px !important;
}

@media only screen and (max-width: 1000px) {
	#main_message {
		max-width:90vw;
		top:20px;
		right: -100vw;
	}
	.move_main_message {
		right:5vw !important;
	}
}

.error {
	background:#ebcece;
	border:1px solid #e9c6c6;
	color:#763c3c;
	padding:10px;
	border-radius:3px;
	width: fit-content;
	margin-bottom:15px;
}
.success {
	background:#dff0d8;
	border:1px solid #d6e9c6;
	color:#3c763d;
	padding:10px;
	border-radius:3px;
	width: fit-content;
	margin-bottom:15px;
}
.error button { background: #db4d4d; }
.error button:hover { background: #c73c3c; }

@media only screen and (max-width:1000px) {
	.desktop { display:none !important;  }
	.mobile  { display:block !important; }
}

.fa-spinner {
	font-size:48px;
	margin-top:30px;
	margin-left:45%;
	line-height:200px;
}

button .fa-spinner {
	font-size:13px !important;
	margin: 0 !important;
	line-height:inherit !important;
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating {
    -webkit-animation: rotating 7s linear infinite;
    -moz-animation: rotating 7s linear infinite;
    -ms-animation: rotating 7s linear infinite;
    -o-animation: rotating 7s linear infinite;
    animation: rotating 7s linear infinite;
}

.loading-spinner {
	width: 100%;
	height: fit-content;
	margin: 30 0;
	display: flex;
	flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
}
button .loading-spinner { margin: 0 !important; }
button .loading-spinner svg {
	width: 15px !important;
	height: 15px !important;
}
.loading-spinner svg {
    animation: rotate 2s linear infinite;
    z-index: 2;
    width: 50px;
    height: 50px;
}
.loading-spinner svg circle {
    stroke: rgb(28, 132, 238);
    stroke-linecap: round;
    animation: dash 1.5s ease-in-out infinite;
}
@keyframes rotate {
    100% {
        transform: rotate(360deg);
   }
}
@keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
   }
    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
   }
    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
   }
}

select, input, button, textarea {
    margin: 3 5 15;
    height: 34px;
    border-radius: 3px;
    padding: .375rem .575rem;
    font-weight: 400;
    line-height: 1.5;
    font-size:15px;
    color: #495057;
    border: 1px solid #ced4da;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
input[type=radio] {
	height: auto;
	cursor: pointer;
}
select:focus, input:focus, textarea:focus {
    color: #495057;
    background-color: #fff;
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}
input[type=radio]:focus {
    background-color: #fff;
    border-color: none;
    outline: 0;
    box-shadow: none;
}
button {
    background: rgb(28, 132, 238);
    color: #fff;
    cursor: pointer;
    outline:none;
    transition:0.1s all;
    font-size:12px;
    padding: .375rem 1.5rem;
}
button:hover {
    background:rgb(15 91 168);
}
button:active {
    transform: translateY(1px);
}
.button-full-width { width: -webkit-fill-available !important; }

button.red-Button { background: #db4d4d; }
button.red-Button:hover { background: #c73c3c; }

@media only screen and (max-width:1000px) {
    button {
        margin: 0 0 15px;
        width:100%;
    }
}

form {
	width: 100%;
    color: #354666;
	padding: 3 0 0 0;
    margin: 30px 0 0;
	overflow: auto;
}
.form-detail {
	border-bottom: 1px solid #ddd;
}
form .opcao, .main_popup .opcao {
	float:left;
	overflow:auto;
	padding: 3 0 0 5;
	margin-top:-3px;
	line-height:34px;
}
@media only screen and (max-width:1000px) {
	form .opcao {
		float:none;
		width:100%;
	}
	form .opcao input {
		width:70%;
		float:right;
	}
}

table {
	width:100%;
	font-size:13px;
	border-collapse: collapse;
}	
table tr {
	border-bottom:1px solid #ccc;
	page-break-inside: avoid;
}
table th {
	text-align:center;
	font-weight:bold;
	padding:12px 15px;
}
table td {
	text-align:center;
	padding:12px 15px;
}
table .icon {
	font-size:24px;
}
table td.total { padding: 10px 5px; }
table td.total span {
	padding: 5px;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    background: rgb(28, 132, 238);
}
table .action {
	font-size:20px;
	opacity:0.9;
	transition:0.1s all;
	margin:3px 2px;
	cursor:pointer;
}
table .action:hover {
	opacity:1;
}
table a { text-decoration:none; }
table .align-left { text-align:left !important; }
table .align-right { text-align:right !important; }
@media only screen and (max-width:1000px) {
	table .remove-mobile { display:none !important; }
}

.paginacao {
	width:100%;
	color: #000;
	margin-top:7px;
	font-size: 13px;
}
.paginacao button { margin: 0; }
.paginacao .active { 
	cursor: default !important;
	background: rgb(15 91 168) !important; 
}
.paginacao button[disabled] {
	cursor: default !important;
	background: #ccc; 
}

@media print {
	body { background: #fff; }
	.paginacao { display: none; }
	#content { margin: 0px !important; }
}

.flex { display: flex; }

.main_popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0,0,0,0.5);
	z-index: 9999;
	display: flex;
}
.main_popup .popup {
	width: fit-content;
	max-width: 80%;
	min-width: 200px;
	height: fit-content;
	max-height: 80%;
	min-height: 100px;
	overflow: auto;
	position: relative;
	margin: auto;
	background: #fff;
	padding: 25 70 25 50;
}
.main_popup .popup::-webkit-scrollbar { width: 10px; }
.main_popup .popup::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 50%);
}
.main_popup .popup::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
    border-radius: 10px;
}

.main_popup .popup .content h1 {
	margin-block-start: 0.5em;
}

.main_popup .popup .fa-times {
	position: absolute;
    right: 20px;
    top: 23px;
    font-size: 30;
    cursor: pointer;
    color: #111111;
    padding: 15px;
}

@media only screen and (max-width:1000px) {
	.main_popup .popup {
		max-width: 90%;
		max-height: 90%;
		padding: 25 15;
	}
	.main_popup .opcao { width: 100%; }
}

@media print {
	.printable .popup {
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100vh !important;
		max-height: 100vh !important;
	}
}

#content {
	min-height: 100px;
	overflow-x: hidden;
	overflow-y: auto;
	margin: 100px 50px 10px calc(20vw + 50px);
	padding: 30px;
	transition: all 0.1s ease-in-out;
	background: #fff;
	-webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 50%);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 50%);
	position:relative;
}
#content:last-of-type { margin-bottom: 100px !important; }
.content-full-width {
	margin: 100px 50px 50px 50px !important;
}
.background-none {
	background: transparent !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
}
.no-padding {
	padding: 10 !important;
}
.no-margin {
	margin-top: 0 !important;
}

@media only screen and (max-width:1000px) {
	#content { margin: 70px 20px 20px 20px;	}
	.content-full-width { margin: 70px 20px 20px 20px !important; }
}

.w_1 {
	width: 100%;
    padding-right: 2%;
	float:left;
	overflow: auto;
	position: relative;
	page-break-inside: avoid;
}

.w_2 {
	width: 50%;
    padding-right: 2%;
	float:left;
	overflow: auto;
	position: relative;
	page-break-inside: avoid;
}

@media only screen and (max-width:1000px) {
	.w_2 {
		width:100%;
		padding-right: 0;
		float: none;
	}
}

#titulo-divisao {
	width: 100%;
    font-size: 24px;
    font-family: 'Helvetica';
    color: #222222;
    margin: 40 0 20;
}

#titulo-pagina {
	width:100%;
	font-family:Helvetica;
	color:#111111;
	overflow:auto;
}
#titulo-pagina div {
	float:left;
}
#titulo-pagina .icone i {
	font-size: 26px;
    height: 40px;
    width: 40px;
    display: flex;
    border-radius: 3px;
    background: #111111;
    color: #dddddd;
    margin-right: 10px;
    justify-content: center;
    align-items: center;
}
#titulo-pagina .info {
	color:#787878;
	font-size:12px;
	line-height:18px;
}
#titulo-pagina .info i {
	font-size:12px;
}
#titulo-pagina .nome {
	font-size:22px;
}


#upload_arquivos {
	box-sizing:border-box;
	cursor:pointer;
	outline:2px dashed #ccc;
	overflow:auto;
	padding:20px;
	max-width: 500px;
	width:100%;
	transition:0.1s all;
	margin:10 auto;
}
#upload_arquivos:hover, .drag_and_drop_border { 
	border-color: #80bdff;
    	box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
	outline:0;
}
#upload_arquivos .texto {
	width:100%;
	text-align:center;
	font-size:14px;
	line-height:2;
	float:left;
	cursor:pointer;
}
#upload_arquivos .texto i {
	color:rgb(28, 132, 238);
	font-size:20px;
}
#upload_arquivos .fa-spinner {
	margin: 0 !important;
	line-height: 1 !important;
}







.dot-falling {
	position: relative;
	left: -9999px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #8bff80;
	color: #8bff80;
	box-shadow: 9999px 0 0 0 #8bff80;
	animation: dotFalling 1s infinite linear;
	animation-delay: .1s;
}
  
.dot-falling::before, .dot-falling::after {
	content: '';
	display: inline-block;
	position: absolute;
	top: 0;
}
  
.dot-falling::before {
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #8bff80;
	color: #8bff80;
	animation: dotFallingBefore 1s infinite linear;
	animation-delay: 0s;
}
  
.dot-falling::after {
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #8bff80;
	color: #8bff80;
	animation: dotFallingAfter 1s infinite linear;
	animation-delay: .2s;
}
  
@keyframes dotFalling {
	0% {
	  box-shadow: 9999px -15px 0 0 rgba(152, 128, 255, 0);
	}
	25%,
	50%,
	75% {
	  box-shadow: 9999px 0 0 0 #8bff80;
	}
	100% {
	  box-shadow: 9999px 15px 0 0 rgba(152, 128, 255, 0);
	}
}
  
@keyframes dotFallingBefore {
	0% {
	  box-shadow: 9984px -15px 0 0 rgba(152, 128, 255, 0);
	}
	25%,
	50%,
	75% {
	  box-shadow: 9984px 0 0 0 #8bff80;
	}
	100% {
	  box-shadow: 9984px 15px 0 0 rgba(152, 128, 255, 0);
	}
}
  
@keyframes dotFallingAfter {
	0% {
	  box-shadow: 10014px -15px 0 0 rgba(152, 128, 255, 0);
	}
	25%,
	50%,
	75% {
	  box-shadow: 10014px 0 0 0 #8bff80;
	}
	100% {
	  box-shadow: 10014px 15px 0 0 rgba(152, 128, 255, 0);
	}
}

.switch_Button {
	position: relative;
	display: inline-block;
	width: fit-content;
	cursor: pointer;
    height: 25px;
    padding-left: 50px;
    line-height: 25px;
	margin-bottom: 15px;
	overflow: hidden;
}

.switch_Button input { 
	max-height: 100%; 
	margin: 0;
}
.switch_Button input[type=checkbox] {
	opacity: 0;
	width: 0;
	height: 0;
}
  
.switch_Button .slider {
	width: 50px;
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
.switch_Button .slider:before {
	position: absolute;
	content: "";
	height: 20px;
    width: 20px;
    left: 4px;
    bottom: 2px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}
  
input:checked + .slider {
	background-color: #2196F3;
}
  
input:focus + .slider {
	box-shadow: 0 0 1px #2196F3;
}
  
input:checked + .slider:before {
	-webkit-transform: translateX(22px);
	-ms-transform: translateX(22px);
	transform: translateX(22px);
}
  
.switch_Button .slider.round {
	border-radius: 34px;
}
  
.switch_Button .slider.round:before {
	border-radius: 50%;
}

.dot-closed {
	position: relative;
	left: -9999px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #fd5c5c;
	color: #fd5c5c;
	box-shadow: 9999px 0 0 0 #fd5c5c;
}
  
.dot-closed::before, .dot-closed::after {
	content: '';
	display: inline-block;
	position: absolute;
	top: 0;
}
  
.dot-closed::before {
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #fd5c5c;
	color: #fd5c5c;
	box-shadow: 9999px 0 0 0 #fd5c5c;
	left: -15px;
}
  
.dot-closed::after {
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background-color: #fd5c5c;
	color: #fd5c5c;
	box-shadow: 9999px 0 0 0 #fd5c5c;
	left: 15px;
}