/* ----------------------------------------------------------------------------------------UNIVERSAL
*/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:100,200,300,400&display=swap');

/* #### Generated By: http://www.cufonfonts.com #### */

@font-face {
    font-family: 'Baloo Tammudu 2 Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Baloo Tammudu 2 Regular'), url('fonts/baloo-tammudu-2-cufonfonts-webfont/BalooTammudu2-Regular.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Baloo Tammudu 2 Medium';
    font-style: normal;
    font-weight: normal;
    src: local('Baloo Tammudu 2 Medium'), url('fonts/baloo-tammudu-2-cufonfonts-webfont/BalooTammudu2-Medium.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Baloo Tammudu 2 SemiBold';
    font-style: normal;
    font-weight: normal;
    src: local('Baloo Tammudu 2 SemiBold'), url('fonts/baloo-tammudu-2-cufonfonts-webfont/BalooTammudu2-SemiBold.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Baloo Tammudu 2 Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Baloo Tammudu 2 Bold'), url('fonts/baloo-tammudu-2-cufonfonts-webfont/BalooTammudu2-Bold.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Baloo Tammudu 2 ExtraBold';
    font-style: normal;
    font-weight: normal;
    src: local('Baloo Tammudu 2 ExtraBold'), url('fonts/baloo-tammudu-2-cufonfonts-webfont/BalooTammudu2-ExtraBold.woff') format('woff');
    }

html { margin:0; padding:0; background-color: whitesmoke; color: #353535; font-family: 'Open Sans', sans-serif; 
text-align: center;}
html * { font-family: 'Open Sans', sans-serif;}

/* LOGIN */


.loginbox { margin: 0 auto;
	padding: 10px 0px 10px 0px;
	width: auto; 
	margin-top: 10px; 
	margin-bottom: 10px; 
	/* background-color: rgba(200,200,200, 0.2); */
}

.loginbox form{
	padding-top: 20px; 
}


/* html */
body{margin: 0;}

header {
	width: 100%;
	top: 0;
	left: 0;
	height: auto;
}
.full-header{
	display: inline-block;
	width: 100%;
	height: 120px;
	background-color: #222;
	background-color: #4b6cb7;
	color: whitesmoke;
}
.left-floater{
	display: inline-block;
	position: absolute;
	width: auto;
	height: 50px;
	line-height: 50px;
	top: 30px;
	left: 20px;
}
.right-floater{
	display: inline-block;
	position: absolute;
	width: auto;
	height: 50px;
	top: 30px;
	right: 20px;
}
.circle-button{
	display: inline-block;
	margin: 0 25px 0 0;
	background-color: transparent;
	border: 0;
	font-size: 42px;
	color: whitesmoke;
	text-decoration: none;
}
.circle-button:hover{
	cursor: pointer;
}
.full-header h1{
	font-family: 'Baloo Tammudu 2 Regular';
	font-size: 36px;
	line-height: 46px;
	margin: 10px 0 0 0;
	display: inline-block;
	position: relative;
	top: 50%;
	left: 0%;
	transform: translateY(-50%);
}

.full-page{
	margin: 50px 0 20px 0;
	padding: 20px 0 20px 0;
	display: inline-block;
	width: 80%;
	background-color: white;
	border-radius: 35px;
}

.icon-button{
	display: inline-block;
	font-size: 40px;
	margin: 20px;
	text-decoration: none;
	color:#252525;
}

.button{
	display: inline-block;
	background-color: #454545;
	color: #333;
	text-decoration: none;
	padding: 15px 5px 15px 5px;
	border-radius: 10px;
	margin: 12px 0 12px 0;
	width: 300px;
	font-weight: 100;
	background-color: #ddd;
}
.button:hover{
	background-color: #4b6bb7;
	color: whitesmoke;
}
.bubble-button{
	display: inline-block;
	min-width: 200px;
	max-width: 400px;
	text-decoration: none;
	color: #454545;
	text-align: center;
	border-radius: 15px;
	border: solid 1px #454545;
	padding: 10px 5px;
	margin: 10px; font-weight: 100;
}
.bubble-button:hover{
	color: white;
	background-color: #FF2316;
	border: solid 1px #FF2316;
}

.principal-header{
	display: inline-block;
	width: 450px;
	height: 250px;
	position: fixed;
	color: whitesmoke;
	z-index: -1;
	border-radius: 45px 45px 0 0;
	background-color: #4b6cb7;
}

.principal-header h1{
	font-family: 'Baloo Tammudu 2 Regular';
	display: inline-block;
	font-size: 24px;
	letter-spacing: 6px;
	margin: 50px 0 5px 0;
}
.principal-header h2{
	display: inline-block;
	font-size: 24px;
	font-weight: 100;
	letter-spacing: 6px;
	margin-top: 5px;
}

.principal-page{
	border-radius: 45px;
	margin-top: 200px;
	padding: 40px 0 0px 0;
	display: inline-block;
	width: 450px;
	background-color: white;
}

.principal-page a{
	display: inline-block;
	width: 350px;
	height: auto;
	color: #333;
	margin-bottom: 40px;
	text-decoration: none;
	position:relative;
	text-align: left;

}
.principal-page i{
	display: inline-block;
	width: 50px;
	font-size: 28px;
	margin: 0;
	padding: 0;
	top: 50%;
	left: 0%;
	transform: translateY(-50%);
}
.principal-page p{
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 290px;
	font-size: 22px;
	font-weight: 100;
	position: absolute;
	top: 50%;
	left: 20%;
	transform: translateY(-50%);
	letter-spacing: 1px;
  
}

/* POPUP */
#overlay_0, #overlay_1, #overlay_2,
#overlay_3, #overlay_4, #overlay_5
  { position: fixed; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.9); 
	display: none; 
	z-index: 9;
}
#overlay_0s, #overlay_1s, #overlay_2s  { position: fixed; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.9); 
	display: inline-block; 
	z-index: 9;
}

.popup { display: inline-block; overflow-y: auto; position: relative; background: #ffffff; text-align: center; font-weight: 300;
	width:400px;  height: auto; max-height: 60vh; padding: 0 0 20px 0; margin: 10vh 0 0 0; border-radius: 20px;}

.header-popup{
	display: inline-block;
	position: relative;
	top: 0;
	background-color: transparent;
	height: 15px;
	width: 100%;
	text-align: right;
}

.close{
	position: absolute;
	width: 40px;
	top: 10px;
	right: 20px;
	font-size: 26px;
	text-decoration: none;
	color: #252525;
}

.close i{
	border-radius: 100%;
}

.close i:hover{
	background-color: #252525;
		color: #252525;
		color: white;

}


/* INPUT */
.g-1{width: 300px;}
.g-2{width: 250px;}
.g-3{width: 200px;}
.g-4{width: 150px;}
.g-5{width: 100px;}
.g-6{width: 75px;}
.g-6{width: 50px;}

.group { 
	display:inline-block;
	position:relative; 
	margin:15px 10px 15px 10px; 
}

.group input {
	font-size:14px;
	padding:10px 10px 6px 10px;
	display:block;
	width: calc(100% - 20px);
	border: 1px solid #757575;
	border-radius: 10px;
	background-color: transparent;
}

.group input:focus { outline:none; }
.group label {
	color: #666; 
	background-color: white; 
	padding: 0 5px;
	font-size: 14px;
	font-weight:normal;
	position:absolute;
	pointer-events:none;
	left: 5px;
	top: 8px;
	transition: 0.2s ease all; 
	-moz-transition: 0.2s ease all; 
	-webkit-transition: 0.2s ease all;
}
  
  /* active state */
.group input:focus ~ label, .group input:valid ~ label {
	top: -10px;
	font-size: 14px;
	color: #252525;
}

.group input:focus{
	border: 1px solid #252525;
}
  
  /* BUTTONS */
.button-a{
	text-decoration: none;
	text-align: center;
	position: relative;
	display: inline-block;
	background-color: transparent;
	color: #FF2316;
	border-width: 0px;
	border: 2px solid #FF2316;
	font-size: 14px;
	margin: 10px;
	padding: 10px;
	height: auto;
	width: auto;
	font-weight: bold;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-radius: 10px;
}
.button-a:hover {
	background-color: #FF2316;
	color: whitesmoke;
	cursor: pointer;
}
.pseudo-a:hover {
	cursor: pointer;
}

.add_form_field { text-decoration: none; text-align: center; position: relative; display: inline-block; background-color: transparent; color: #333; border-width: 0px; border: 2px solid orangered; 
	font-size: 14px; margin: 10px; padding: 10px; height: auto;  width: auto; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; border-radius: 10px; color: #FF2316; }
.add_form_field:hover {  background-color: #FF2316; color: whitesmoke; cursor: pointer; font-weight: bold; }

.button-small, .button-small-consultor { text-decoration: none; text-align: center; position: relative; display: inline-block; background-color: transparent; color: #FF2316; border: 1px solid #FF2316;
	font-size: 12px; margin: 5px; padding: 6px 10px 6px 10px; height: auto;  width: auto; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; border-radius: 6px;}
.button-small i, .button-small-consultor i {color: #FF2316;}
.button-small:hover, .button-small-consultor:hover { background-color: #FF2316; color: #FAFAFA; cursor: pointer; font-weight: bold; }
.button-small:hover i, .button-small-consultor:hover i { color: #FAFAFA; }

.button-small-a { text-decoration: none; text-align: center; position: relative; display: inline-block; background-color: transparent; color: #FF2316; border: 2px solid #FF2316;
	font-size: 12px; margin: 10px; padding: 6px 10px 6px 10px; height: auto;  width: auto; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; border-radius: 6px; }
.button-small-a:hover{  background-color: #FF2316; color: #FAFAFA; cursor: pointer; font-weight: bold;}

.simple-button{
	border-radius: 10px;
	border: 2px solid #FF2316;
	color: #FF2316;
	padding: 2px 5px 2px 5px;
	text-decoration: none;	
}

.simple-button:hover, .simple-button:hover i{
	cursor: pointer;
	background-color: #FF2316;
	color: #FAFAFA;
}

.simple-button i{
	color: #FF2316;
	display: inherit;
	margin: 0;
	background-color: transparent;
	width: auto;
	height: auto;
}

.simple-button i:hover{
	color: #FAFAFA;
}

/* TABLE */
.table-default{
	border-collapse: collapse;
	display: inline-block;
	font-weight: 100;
	border-radius: 10px;
}

.table-default a {text-decoration: none; color: inherit;}
.table-default th { padding: 10px; font-weight: 500; }


.table-default tr:first-child th { border: solid 1px transparent; 
	border: solid 1px #8198cc;
}
.table-default tr:first-child th:first-child { border-radius: 0px 0 0 0; padding-left: 5px; }
.table-default tr:first-child th:last-child { border-radius: 0 0px 0 0; padding-right: 5px; }
.table-default tr:nth-child(0n+1) {background-color:#8198cc; color: whitesmoke; font-weight: 100;border-radius: 5px;}

.table-default td {height: 40px; padding: 0 5px 0 5px; }
.table-default td:nth-child(0n+1) {font-weight: 400;}
.table-default tr:nth-child(2n+3) {background-color: #efefef;}

.table-default tr {border: solid 1px #eee; }
.table-default tr:not(:first-child):hover {background-color: #ccc; }

.no-hover tr:not(:first-child):hover {background-color: inherit; }
.no-hover tr:nth-child(2n+3):hover {background-color: #efefef;}


/* LOADER */

#loader-container{
	display: none;
	position: fixed;
	margin: 0;
	border-radius: 0;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	text-align: center;
	z-index: 99999;
	background-color: #fafafa;
}

.loader {
	margin-top: 40vh;
	display: inline-block;
	border: 16px solid gainsboro;
	border-radius: 50%;
	border-top: 16px solid #252525;
	width: 120px;
	height: 120px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
  }
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}
  
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}








.form-preencher h2 { font-weight: 200; width: 95%; text-align: left; padding: 10px 0 10px 5%;
	font-size: 24px; margin: 25px 0 -5px 0; 
	background-color: #486cb9;
	color: whitesmoke;
}
.form-fill-container{
	display: inline-block;
	width: calc(90% - 2px);
	padding: 10px 5% 20px 5%;
	text-align: center;
	border-top: 0px;
}
.checkbox-container-new {display: inline-block; width: 100%; text-align: left; padding: 5px 0 5px 0;}
.checkbox-container-new div{display: inline-block; margin: 5px 10px;}


.limit-checkbox-container {
	display: inline-block;
	width: calc(100% - 20px);
	margin: 10px 0 20px 0;
	border-radius: 10px;
	border: 1px solid #93a6d3;
	padding: 10px;
}
.limit-checkbox-container h3{
	display: inline-block; padding: 5px 0 5px 5%; width: 100%; line-height: 25px; text-align: left; text-decoration: none; 
	color: #6e89c5;
	margin: -15px -15px 0px -15px;
	padding: 10px;
	border-radius: 9px 9px 0 0;
}

.headerinside {
	display: inline-block; margin: 0px; width: 80%; line-height: 25px; text-align: left; text-decoration: none;  padding-left: 10%;
	background-color: #e8effc;
}



.form-button{
	display: inline-block;
	width: 120px;
	height: 120px;
	border-radius: 10px;
	border: 2px solid #FF2316;
	background-color: transparent;
	text-align: center;
	text-decoration: none;
	color: #FF2316;
	margin: 15px;
}
.form-button:hover{
	cursor: pointer;
	background-color: #FF2316;
	color: whitesmoke;
}

.form-button i{
	font-size: 36px;
	margin: 20px 0 20px 0;
}
.form-button span{
	font-size: 14px;
}






.floater{
	display: inline-block;
	position: fixed;
	left: 10px;
	bottom: 25px;
	text-align: left;
}

.float-button{
	text-align: center;
	display: inline-block;
	margin: 5px;
	padding: 20px;
	width: 30px;
	height: 30px;
	line-height: 30px;
	font-size: 28px;
	color: #4b6cb7;
	border: 2px solid #4b6cb7;
	border-radius: 80px;
}

.float-button:hover{
	color: white;
	background-color: #4b6cb7;
	cursor: pointer;
}

.anchor{
	display: inline-block;
	text-decoration: none;
	color: #252525;
	padding: 5px 10px 5px 10px;
	border-radius: 10px;
	border: solid 1px #757575;
	font-weight: 100;
}

/* CHECKBOX */
.lblitem:hover{
	cursor: pointer;
}
.lblitem{
	border-radius:10px;
	padding: 5px 10px 5px 10px;
	margin: 5px;
	display: inline-block;
	user-select: none;
	border: solid 1px #cacaca;
	color: #454545;
	font-weight: 100;
}
input.chkitem[type="radio"]:checked + label, input.chkitem[type="checkbox"]:checked + label  {
	background-color: #FF2316;
	border-color: #FF2316;
	color: white;
}





.small-block, .small-block-2{
	display: inline-block;
	background-color: transparent;
	margin: 10px ;
	border-radius: 15px;
	text-align: center;
	color: #454545;
	border: solid 1px #757575;
	font-weight: 100;
}
.textarea-block{
	border-radius: 15px 15px 0px 0px;
}
.colored-block{
	background-color: #6687e7;
}
.no-border{
	border:  0px;
}
.darker{
	background-color: #8198cc;
	border: solid 1px #8198cc;
	color: #FAFAFA;
}
.complimentary{
	background-color: #FF2316;
	border: solid 1px #FF2316;
	color: #FAFAFA;
}

.textarea-header{
	display: inline-block;
	position: relative;
	width: calc(60vw - 14px);
	background-color: #8198cc;	
	color:white;
	margin-bottom: -10px;	
	border-radius: 10px 10px 0 0;
}
.small-block textarea{
	display: inline-block;
	position: relative;
	width: calc(60vw);
	height: 100px;
	margin: 5px 10px 5px 10px;
	white-space: pre-wrap;
	resize: vertical;
}
.popup textarea{
	display: inline-block;
	position: relative;
	width: 300px;
	height: 100px;
	margin: 5px 10px 5px 10px;
	white-space: pre-wrap;
	resize: vertical;
}
.small-block span,  .small-block2 span{
	display: inline-block;
	padding: 5px 10px 5px 10px;
}
.small-block select, .comodocontainer select{
	display: inline-block;
	margin: 5px 10px 5px 10px;
	border: none;
	color: #454545;
	font-weight: 100;
	border-radius: 10px;
}
.small-block select:focus, .comodocontainer select:focus{
	border:none;
	outline: solid 1px #999;
}
.comodocontainer input, .comodocontainer select{
	display: inline-block;
	background-color: transparent;
	height: 98%;
}
.small-block .sub-block{
	display: inline-block;
	margin: 5px 10px 5px 10px;
	background-color: #FAFAFA;
	border-radius: 12px;
	color: #252525;
}
.small-block textarea{
	display: inline-block;
	position: relative;
	width: calc(60vw);
	height: 100px;
	margin: 5px 10px 5px 10px;
	white-space: pre-wrap;
}
  
/* TABLE */
.container1, .container-table {
	border-collapse: collapse;
	display: inline-block;
}

.container1 tr:first-child span, .container-table tr:first-child span{
	display: inline-block;
	padding: 10px 0 10px 0; 
}

.container1 tr:first-child, .container-table tr:first-child{
	background-color: #c9d2e9; text-align: center; width: auto;white-space: nowrap; color: #333;
}
.container1 tr:first-child th, .container-table tr:first-child th{
	padding: 0 20px 0 20px;
}
.container1 tr:first-child th:last-of-type, .container-table tr:first-child th:last-of-type{
	min-width: auto;
}

.container1 input, .container-table input{
	border:0;
	border-bottom: solid 1px;
}
.container1 input:focus, .container-table input:focus{
	outline: none;
}
.container1 input, .container-table input{
	display: inline-block;
	width: 90%;
}


.container-table th{
	text-align: center;
}
.container-table select{
	border: 1px solid transparent;
}
.container-table select:focus{
	outline: 1px solid #ccc;
}
/* ELEMENTOS TABLE */
.fix-col{
	display: inline-block;
	position: absolute;
	height: 40px;
	line-height: 40px;
	width: 40px;
	margin-left: -50px;
	border :transparent;
}
.input-el { display: inline-block; border:0; border-bottom: solid 1px #757575;
	border-radius: 0px; padding: 6px; margin: 5px; text-align: center;
	background-color: transparent;
}
.input-menor {
	width: 80px;
}
.input-medio {
	width: 100px;
}
.input-medio2 {
	width: 150px;
}
.input-largo {
	width: 300px;
	text-align: center;
}
.input-auto {
	width: auto;
}
#elementos{
	border-collapse: collapse;
}
	
#elementos th, td {
	min-width: auto; height: 25px; line-height: 25px; width: auto; text-align: center; white-space: nowrap;
}

#elementos tr:nth-child(2n) {
	background-color: #eee;
}
.border-on th, td {
	border: 1px solid gainsboro;
}
#elementos input {
	display: inline-block; 
	border:0;
	border-bottom: solid 1px #757575;
	border-radius: 0px; padding: 10px 6px 6px 6px; text-align: center;
	background-color: transparent;
}
#elementos input:focus {
	outline: solid 2px #8198cc;
}
#elementos input:disabled {
	border: none;
	background-color: transparent;
	color: #333;
	/* background: repeating-linear-gradient(
	45deg,
	#606dbc,
	#606dbc 10px,
	#465298 10px,
	#465298 20px
	); */
}
#elementos select:disabled {
	border: none;
	background-color: transparent;
	color: #000;
}
#elementos textarea:disabled {
	border: none;
	background-color: transparent;
	color: #000;
}


/* HOMOGENEIZAÇÃO TABLE */


#table-fatores {
	border: 0;
	border-collapse: collapse;
	font-weight: 100;
}
#table-fatores tr, #table-fatores td {
	font-weight: 100;
}
#table-fatores ins {
	display: inline-block;
	width: 250px;
	text-decoration: none;
	font-weight: 400;
}
.tr-title th span{
	display: inline-block;
	width: 120px;
	font-weight: 400;
	font-size: 14px;
	text-align: center;
	padding: 10px;
}
#table-fatores tr {border-bottom: solid 1px #ddd;}
#table-fatores .tr-title {background-color: #d1dffa;}
#table-fatores .tr-av {background-color: #ffe4b3;}
.coluna-fator{
	background-color: #d1dffa;
	border: #d1dffa;
}

/* panel page */
.container-dash-page{
	width: 80%;
	margin-left: 10%;
	text-align: center;
}
.container-dash-page div span {
	font-size: 20px;
	width: 100%;
	display: inline-block;
	color: #FAFAFA;
	height: 40px;
	line-height: 40px;
	border-radius: 5px;
}

.container-dash-page div p {
	margin: 0 0 20px 0;
	display: inline-block;
	font-weight: 300;
	text-align: center;
	font-size: 28px;
	display: inline-block;
	width: 120px;
	height: 120px;
	line-height: 120px;
	border-radius: 200px;
	border: 4px solid gainsboro;
}
.container-dash-page div {
	text-decoration: none;
	text-align: center;
	display: inline-block;
	color: #111111;
	font-size: 14px;
	width: 200px;
	font-weight: 300;
	letter-spacing: 0px;
	margin: 15px;
	border-radius: 10px;
}
.container-dash-page a {
	text-decoration: none;
	color: inherit;
}


.atraso{
	background-color: #ED213A;
}
.abertas-hoje{
background-color: #4b6cb7;
}
.vencendo-hoje{
	background-color: #FF512F;
}
.a-vencer{
	background-color: goldenrod;
}
.canceladas{
	background-color: #454545;
}
.finalizadas{
	background-color: lightseagreen;
}

/* Progress bar */
.progress{display:flex;height:1rem;overflow:hidden;font-size:.75rem;background-color:#e9ecef;border-radius:0}
.progress-bar{display:flex;flex-direction:column;justify-content:center;overflow:hidden;color:#fff;text-align:center;white-space:nowrap;background-color:#0d6efd;background-color:#6687e7;transition:width .6s ease}
@media (prefers-reduced-motion:reduce){
	.progress-bar{transition:none}
}



/* COMENTARIOS */
.container-de-comentario{
	display: block;
	text-align: left;
}
.caixa-de-comentario{
	left: 10px;
	display: inline-block;
	padding: 10px 20px 10px 20px;
	background-color: #eee;
	margin: 10px;
	min-width: 350px;
	max-width: calc(100% - 60px);
	border-radius: 15px;
	text-align: left;
}
.caixa-de-comentario ins{
	text-decoration: none;
	margin: 0;
	padding: 0;
}
.caixa-de-comentario .titulo{
	display: inline-block;
	font-weight: bold;
	width: 100%;
	text-align: left;
}
.caixa-de-comentario .status{
	width: 100%;
	font-weight: 100;
}
.caixa-de-comentario .conteudo{
	width: 100%;
	font-weight: 100;
}
.caixa-de-comentario .timestamp{
	width: 100%;
	font-weight: 100;
	font-size: 70%;
}

.meu-comentario{
	background-color: gray;
}
.outro-comentario{
	background-color: lightgray;
}