/************
	AMGES 
*************/

/************
 UTILITARIOS
*************/

/* Field Action */
.ag-field-action {
	display: flex;
}

.ag-field-action__icon {
	margin: 0px 0px 0px 10px;
}

/*input {text-transform: uppercase;}*/

.ag-uppercase{
	text-transform: uppercase;
}

.ag-uppercase-none{
	text-transform: none;
}

/* INPUT TEXT TRANSFORM TODOS */
input { 
    text-transform: uppercase;
}
::-webkit-input-placeholder { /* WebKit browsers */
    text-transform: none;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    text-transform: none;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    text-transform: none;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    text-transform: none;
}
::placeholder { /* Recent browsers */
    text-transform: none;
}

/**********************
 PRIMEFACES DATATABLE
**********************/
.ui-datatable thead th, .ui-datatable tbody td, .ui-datatable tfoot td {
    border-style: none;
}
.ui-paginator-page{
	background-color:none !important;
}


/*************
    COLORS
**************/

.card [data-background-color="ag-white"] {
  background: #ffffff;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61, 61, 61, 0.8);
}

.card [data-background-color="ag-ciano"] {
  background: rgb(3, 228, 255);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(64, 149, 255, 0.8);
}

.card [data-background-color="ag-green"] {
  background: rgb(145, 185, 64);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-grey"] {
  background: rgb(218, 229, 238);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-blue"] {
  background: rgb(0, 174, 255);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-yellow"] {
  background: rgb(248, 187, 0);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-orange"] {
  background: rgb(255, 156, 0);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-purple"] {
  background: rgb(156, 39, 176);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-amber"] {
  background: rgb(255, 195, 91);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61,61,61, 0.8);
}

.card [data-background-color="ag-full-image"] {

	padding: 0px !important;
	background: #ffffff;
  	box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(61, 61, 61, 0.8);
}

/*
DROPDOWN JS
*/

.dropdownjs {
  position: relative;
}

.dropdownjs * {
  box-sizing: border-box;
}

.dropdownjs > input {
  width: 100%;
  padding-right: 30px;
  text-overflow: ellipsis;
}

.dropdownjs > ul {
  -webkit-transition: all 150ms linear;
  -moz-transition: all 150ms linear;
  -o-transition: all 150ms linear;
  -ms-transition: all 150ms linear;
  transition: all 150ms linear;
  display: block;
  margin-top: -20px;
  min-width: 200px;
  opacity: 0;
  padding: 0;
  position: absolute;
  visibility: hidden;
  z-index: 10000;
}

.dropdownjs > input.focus ~ ul {
  opacity: 1;
  visibility: visible;
  margin-top: 1px;
}

.dropdownjs > ul > li {
  list-style: none;
  padding: 10px 20px;
}

.dropdownjs > ul > li.dropdownjs-add {
  padding: 0;
}

.dropdownjs > ul > li.dropdownjs-add > input {
  border: 0;
  padding: 10px 20px;
  width: 100%;
}

/* Theme */
.dropdownjs > input[readonly] {
  cursor: pointer;
}

select[data-dropdownjs][disabled] + .dropdownjs > input[readonly] {
  cursor: default;
}

.dropdownjs > ul {
  background: #FFF;
  border-radius: 4px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  padding: 5px 0px;
  overflow: auto;
  max-width: 500px;
}

.dropdownjs > ul > li {
  cursor: pointer;
  word-wrap: break-word;
  font-size: 13px;
  font-weight: 400;
  padding: 10px 20px;
  margin: 0 5px;
  border-radius: 2px;
  -webkit-transition: all 150ms linear;
  -moz-transition: all 150ms linear;
  -o-transition: all 150ms linear;
  -ms-transition: all 150ms linear;
  transition: all 150ms linear;
}

.dropdownjs > ul > li .selected, .dropdownjs > ul > li:active, .dropdownjs > ul > li:focus, .dropdownjs > ul > li:hover {
  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
  background-color: #5cb860;
  color: #FFFFFF;
}

.dropdownjs > ul > li > .close:before {
  content: "\00d7";
  display: block;
  position: absolute;
  right: 15px;
  float: right;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .6;
}

.dropdownjs > ul > li:h > .close:hover:before {
  opacity: .9;
}

.dropdownjs::after {
  right: 10px;
  top: 20px;
  font-size: 25px;
  position: absolute;
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  content: "\e5c5";
  pointer-events: none;
  color: #fff;
}

/* CHARTS */
.ct-label {
    fill: rgba(0, 0, 0, 1.0) !important;
    color: rgba(0, 0, 0,1.0) !important;
    font-size: 1.3rem !important;
    line-height: 1 !important;
}

/* RADIO */

/***************
  Radio Buttons
***************/
/* Remove default Radio Buttons */
[type="radio"]:not(:checked), [type="radio"]:checked {
  position: absolute;
  left: -9999px; }

[type="radio"]:not(:checked) + label, [type="radio"]:checked + label {
  position: relative;
  padding-left: 35px;
  padding-right: 10px; /* NOVO */
  cursor: pointer;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  font-size: 1.3rem;
  -webkit-transition: 0.28s ease;
  -moz-transition: 0.28s ease;
  -o-transition: 0.28s ease;
  -ms-transition: 0.28s ease;
  transition: 0.28s ease;
  -webkit-user-select: none;
  /* webkit (safari, chrome) browsers */
  -moz-user-select: none;
  /* mozilla browsers */
  -khtml-user-select: none;
  /* webkit (konqueror) browsers */
  -ms-user-select: none;
  /* IE10+ */ }

[type="radio"] + label:before, [type="radio"] + label:after {
  content: '';
  position: absolute;
  left: 0px;
  top: 0px;
  margin: 4px;
  width: 16px;
  height: 16px;
  z-index: 0;
  -webkit-transition: 0.28s ease;
  -moz-transition: 0.28s ease;
  -o-transition: 0.28s ease;
  -ms-transition: 0.28s ease;
  transition: 0.28s ease; }

/* Unchecked styles */
[type="radio"]:not(:checked) + label:before {
  border-radius: 50%;
  border: 2px solid #5a5a5a; }

[type="radio"]:not(:checked) + label:after {
  border-radius: 50%;
  border: 2px solid #5a5a5a;
  z-index: -1;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0); }

/* Checked styles */
[type="radio"]:checked + label:before {
  border-radius: 50%;
  border: 2px solid transparent; }

[type="radio"]:checked + label:after {
  border-radius: 50%;
  border: 2px solid #9c27b0;
  background-color: #9c27b0;
  z-index: 0;
  -webkit-transform: scale(1.02);
  -moz-transform: scale(1.02);
  -ms-transform: scale(1.02);
  -o-transform: scale(1.02);
  transform: scale(1.02); }

/* Radio With gap */
[type="radio"].with-gap:checked + label:before {
  border-radius: 50%;
  border: 2px solid #9c27b0; }

[type="radio"].with-gap:checked + label:after {
  border-radius: 50%;
  border: 2px solid #9c27b0;
  background-color: #9c27b0;
  z-index: 0;
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5); }

/* Disabled style */
[type="radio"]:disabled:not(:checked) + label:before, [type="radio"]:disabled:checked + label:before {
  background-color: transparent;
  border-color: rgba(0, 0, 0, 0.26); }

[type="radio"]:disabled + label {
  color: rgba(0, 0, 0, 0.26); }

[type="radio"]:disabled:not(:checked) + label:hover:before {
  border-color: rgba(0, 0, 0, 0.26); }


/***************
   Checkboxes
***************/
/* CUSTOM CSS CHECKBOXES */

/* Remove default checkbox */
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
  position: absolute !important;
  left: -9999px !important; }

[type="checkbox"]:not(:checked) + label, [type="checkbox"]:checked + label {
  position: relative !important;
  padding-left: 35px !important;
  cursor: pointer !important;
  display: inline-block !important;
  height: 25px !important;
  line-height: 25px !important;
  font-size: 1rem !important;
  -webkit-user-select: none !important;
  /* webkit (safari, chrome) browsers */
  -moz-user-select: none !important;
  /* mozilla browsers */
  -khtml-user-select: none !important;
  /* webkit (konqueror) browsers */
  -ms-user-select: none !important;
  /* IE10+ */ }

/* checkbox aspect */
[type="checkbox"] + label:before {
  content: '' !important;
  position: absolute !important;
  margin-top: 2px !important;
  left: 0 !important;
  z-index: 0 !important;
  -webkit-border-radius: 1px !important;
  -moz-border-radius: 1px !important;
  border-radius: 1px !important;
  background-clip: padding-box !important;
  -webkit-transition: 0.2s !important;
  -moz-transition: 0.2s !important;
  -o-transition: 0.2s !important;
  -ms-transition: 0.2s !important;
  transition: 0.2s !important; }

/* Unchecked styles */
[type="checkbox"]:not(:checked) + label:before {
  top: 0px !important;
  width: 18px !important;
  height: 18px !important;
  border: 2px solid #5a5a5a !important; }

/* Checked styles */
[type="checkbox"]:checked + label:before {
  left: -3px !important;
  top: -4px !important;
  width: 12px !important;
  height: 22px !important;
  border-top: 2px solid transparent !important;
  border-left: 2px solid transparent !important;
  border-right: 2px solid #26a69a !important;
  border-bottom: 2px solid #26a69a !important;
  -webkit-transform: rotateZ(40deg) !important;
  -moz-transform: rotateZ(40deg) !important;
  -ms-transform: rotateZ(40deg) !important;
  -o-transform: rotateZ(40deg) !important;
  transform: rotateZ(40deg) !important;
  -webkit-backface-visibility: hidden !important;
  -webkit-transform-origin: 100% 100% !important;
  -moz-transform-origin: 100% 100% !important;
  -ms-transform-origin: 100% 100% !important;
  -o-transform-origin: 100% 100% !important;
  transform-origin: 100% 100% !important; }

/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before {
  top: 0 !important;
  left: 0 !important;
  box-shadow: none !important;
  background-color: rgba(0, 0, 0, 0.26) !important;
  width: 18px !important;
  height: 18px !important;
  border: 2px solid rgba(0, 0, 0, 0.26) !important;
  -webkit-transform: rotateZ(0deg) !important;
  -moz-transform: rotateZ(0deg) !important;
  -ms-transform: rotateZ(0deg) !important;
  -o-transform: rotateZ(0deg) !important;
  transform: rotateZ(0deg) !important; }

[type="checkbox"]:disabled:checked + label:before {
  left: -3px !important;
  top: -4px !important;
  width: 12px !important;
  height: 22px !important;
  border-top: 2px solid transparent !important;
  border-left: 2px solid transparent !important;
  border-right: 2px solid rgba(0, 0, 0, 0.26) !important;
  border-bottom: 2px solid rgba(0, 0, 0, 0.26) !important;
  -webkit-transform: rotateZ(40deg) !important;
  -moz-transform: rotateZ(40deg) !important;
  -ms-transform: rotateZ(40deg) !important;
  -o-transform: rotateZ(40deg) !important;
  transform: rotateZ(40deg) !important;
  -webkit-backface-visibility: hidden !important;
  -webkit-transform-origin: 100% 100% !important;
  -moz-transform-origin: 100% 100% !important;
  -ms-transform-origin: 100% 100% !important;
  -o-transform-origin: 100% 100% !important;
  transform-origin: 100% 100% !important; }

[type="checkbox"]:disabled:checked + label {
  color: rgba(0, 0, 0, 0.26) !important; }

[type="checkbox"]:disabled:not(:checked) + label:hover:before {
  border-color: rgba(0, 0, 0, 0.26) !important; }
  
  
/* REMOVE LINHA DUPLICADA AUTOCOMPLETE 
.form-control .form-group .form-control {
    border: 0;
    background-image: linear-gradient(#9c27b0, #9c27b0), linear-gradient(#D2D2D2, #D2D2D2);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: blue;
    transition: background 0s ease-out;
    float: none;
    box-shadow: none;
    border-radius: 0;
    font-weight: 400;
}
*/

/* RETIRA LINHA DUPLICADA AUTOCOMPLET */
.form-control .form-control-autocomplete {
    border: 0;
    /*background-image: linear-gradient(#9c27b0, #9c27b0), linear-gradient(#D2D2D2, #D2D2D2);*/
    background-image: none;
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: transparent;
    transition: background 0s ease-out;
    float: none;
    box-shadow: none;
    border-radius: 0;
    font-weight: 400;
    width: 100%;
}

/* COLOCA FUNDO BRANCO AUTOCOMPLET */
.ui-autocomplete-panel{
	background-color: white !important;
	z-index: 10000 !important; /* AUTO COMPLETE ACIMA DO MODAL */
}

/* MODAL LARGE */
@media only screen and (max-width: 747px) {

	.modal .modal-large {
	  margin-top: 20px !important;
	  width: 95% ;
	  
	}
	
}

@media only screen and (min-width: 747px) {

	.modal .modal-large {
	  margin-top: 100px !important;
	  width: 80% ;
	  
	}
	
}

/* MODAL HEIGHT */
@media only screen and (max-width: 747px) {

	.modal .modal-height {
	  margin-top: 20px !important;
	  width: 95% ;
	  height: 95% !important;
	}
	
}

@media only screen and (min-width: 747px) {

	.modal .modal-height {
	  margin-top: 20px !important;
	  width: 95% ;
	  height: 95% !important;
	  
	}
	
}


/* SCHEDULE PRIMEFACES */
.fc th, .fc td {
    
    border-color: #ddd !important;
}

.fc-event {
    position: relative;
    display: block;
    font-size: .85em;
    line-height: 1.3;
    border-radius: 3px;
    border: 1px solid #4caf50 !important;
    background-color: #4caf50 !important;
    font-weight: normal;
}

/* MODIFICAR LEFT SCHEDULE CASO QUERIA COLOCAR TITLE 
.fc-toolbar .fc-left {
    float: left;
    background-color: #9c27b0;
    color: #FFFFFF;
    border-radius: 30px;
    font-size: 1rem;
    padding: 0px 10px 0px 10px;
}
*/

/* CALENDARIO */

.feriado.fc-event{
	position: relative;
    display: block;
    font-size: .85em;
    line-height: 1.3;
    border-radius: 3px;
    border: 1px solid #9c27b0 !important;
    font-weight: normal;
    background-color: #9c27b0 !important;
}

.recesso.fc-event{
	position: relative;
    display: block;
    font-size: .85em;
    line-height: 1.3;
    border-radius: 3px;
    border: 1px solid #FF9200 !important;
    font-weight: normal;
    background-color: #FF9200 !important;
}

.aulasuspensa.fc-event{
	position: relative;
    display: block;
    font-size: .85em;
    line-height: 1.3;
    border-radius: 3px;
    border: 1px solid #FF000E !important;
    font-weight: normal;
    background-color: #FF000E !important;
}

.lotacao-desvinculada{
	/* rgba(254, 127, 11, 0.2) */
	background: rgba(255, 253, 150, 0.8) !important;
}

.carencia {
	background: rgba(255, 253, 150, 0.8) !important;
}
/* FONTE MODIFICACAO PARA DEIXAR FONT MAIS NITIDA - MATERIAL DASHBOARD */
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
  font-weight: 0 !important; /* VER EM MATERIAL-DASHBOARD.CSS - MODIFICADO LA */
}

/* MUDAR COR PADRAO DAS LINHAS DA TABELA */
.table-striped>tbody>tr:nth-of-type(odd) {
 background-color:#e9faff !important;
}

/* CUSTOM MATERIAL DASHBOARD */
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
    font-weight: 0 !important;
    line-height: 1.5em;
}
/* COSTUMIZAR PROGRESS BAR */
.green-progressbar .ui-progressbar-value {
    border: 0 none;
    margin: 0;
    background: #6dbb1b !important;
    /*border-radius: 40px !important;*/
}

.orange-progressbar .ui-progressbar-value {
    border: 0 none;
    margin: 0;
    background: #ff9200 !important;
    /*border-radius: 40px !important;*/
}

.red-progressbar .ui-progressbar-value {
    border: 0 none;
    margin: 0;
    background: #ff2600 !important;
    /*border-radius: 40px !important;*/
}

.yellow-progressbar .ui-progressbar-value {
    border: 0 none;
    margin: 0;
    background: #fefb00 !important;
    /*border-radius: 40px !important;*/
}

/*
body .ui-progressbar {
  border: 0 none;
  height: 1.3rem !important;
  background: #ff1515 !important;
  border-radius: 40px !important;
}
*/

/* 26 ABRIL 2022 -  p:selectManyMenu PRIMEFACES */

body .ui-selectonelistbox .ui-selectlistbox-filter-container .ui-icon, body .ui-selectmanymenu .ui-selectlistbox-filter-container .ui-icon {
  font-family: 'primeicons' !important;
  font-style: normal;
  font-weight: normal;
  display: inline-block;
  background: none;
  position: absolute;
  left: 2rem !important;  /* MODIFICADO: 1.5rem */
  top: 40% !important; /* MODIFICADO: 50% */
  right: auto;
  bottom: auto;
  margin-top: -0.5rem;
  color: #6c757d;
  
  /*ADICIONADO*/
  font-size: 1.5rem !important;
}

body .ui-selectonelistbox .ui-selectlistbox-filter-container .ui-selectlistbox-filter.ui-inputfield, body .ui-selectmanymenu .ui-selectlistbox-filter-container .ui-selectlistbox-filter.ui-inputfield {
  padding: 0.5rem 0.5rem;
    padding-left: 0.5rem;
  width: 100%;
  padding-left: 3rem !important;
}

.ui-inputfield {
  margin: 0;
  outline: medium none;
  padding: 4px;
  font-weight: normal;
  font-size: 1.4rem !important;
}

/* ALTERADO EM 17/06/2022 */

.main-panel > .content {
  margin-top: 70px;
  /*padding: 30px 15px;*/
  padding: 0px 0px !important;
  min-height: calc(100vh - 123px);
}

/* NOVO TIMELINE */
.timeline-1 {
  border-left: 3px solid #94d04c;
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
  background: rgba(157, 193, 131, 0.09);
  margin: 0 auto;
  position: relative;
  padding: 50px;
  list-style: none;
  text-align: left;
  max-width: 60%;
}

@media (max-width: 767px) {
  .timeline-1 {
    max-width: 98%;
    padding: 25px;
  }
}

.timeline-1 .event {
  border-bottom: 1px dashed #000;
  padding-bottom: 25px;
  margin-bottom: 25px;
  position: relative;
  
}

@media (max-width: 767px) {
  .timeline-1 .event {
    padding-top: 30px;
  }
}

.timeline-1 .event:last-of-type {
  padding-bottom: 0;
  margin-bottom: 0;
  border: none;
}

.timeline-1 .event:before,
.timeline-1 .event:after {
  position: absolute;
  display: block;
  top: 0;
}

.timeline-1 .event:before {
  left: -207px;
  content: attr(data-date);
  text-align: right;
  font-weight: 100;
  font-size: 0.9em;
  min-width: 120px;
  
}

@media (max-width: 767px) {
  .timeline-1 .event:before {
    left: 0px;
    text-align: left;
  }
}

.timeline-1 .event:after {
  -webkit-box-shadow: 0 0 0 3px #25a857;
  box-shadow: 0 0 0 3px #94d04c;
  left: -55.8px;
  background: #fff;
  border-radius: 50%;
  height: 9px;
  width: 9px;
  content: "";
  top: 5px;
}

@media (max-width: 767px) {
  .timeline-1 .event:after {
    left: -31.8px;
  }
}

.ui-splitbutton {
  margin-right: .5rem;
  font-size: 3rem !important;
}

body .ui-button.ui-button-icon-only .ui-icon {
  position: absolute;
  top: 50%;
  left: 50%;
}

/* TAMANHO DO ICONE DO MENU */
body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-menuitem-icon {
  margin-right: .5rem;
  vertical-align: middle;
  float: none;
  color: #6c757d;
  font-size: 1.3rem;
}

/* TRABALHANDO COM STATUS TABELAS */
.item-badge.status-success {
    background: #c8e6c9;
    color: #256029;
}

.item-badge.status-warning {
    background: #feedaf;
    color: #8a5340;
}

.item-badge.status-danger {
    background: #ffcdd2;
    color: #c63737;
}

.item-badge.status-info {
    background-color: #b3e5fc;
    color: #23547b;
}

.item-badge {
    border-radius: 2px;
    padding: 0.25em 0.5rem;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .3px;
}
body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container .ui-selectcheckboxmenu-token {
  padding: 1px 0 !important;
  margin: 0 .5rem 0 0 !important;
  background: #50d6ff66 !important;
  color: #000 !important;
  border-radius: 4px !important;
}

.checkbox label, .radio label, label, .label-on-left, .label-on-right {
  font-size: 14px !important;
  line-height: 1.42857 !important;
  color: #000;
  font-weight: 400;
}

body .ui-chkbox .ui-chkbox-box {
  border: 1px solid #ced4da;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
  border-width: 2px;
  background: #fff;
  width: 2rem !important;
  min-width: 2rem !important;
  height: 2rem !important;
  text-align: center;
  position: relative;
  border-radius: 4px;
  transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s,opacity .2s;
}