/* ********************************************************************************************/
/*                           >>> DOCUMENTO DE ESTILO EXPANDBOX <<<                            */
/* ********************************************************************************************/
/*-Data da Criação: 06/11/2015                                                                */
/*-Responsável: André Monteiro                                                                */
/*-Observação: Definição dos estilo do componente expandbox  						   		  */   
/*============================================================================================*/
.expandbox {
	width:100%; 
	height:auto; 
	background-color:#f1efe9;
	 border:#dbd9d5 solid 1px; position:relative; margin:44px 0px 40px 0px;}
.expandbox .label {background-color:#aaa69d; height:43px; position: absolute; top:-44px; left:-1px; font-size:18px; color:#fff; font-weight:bold; text-transform:uppercase; padding:14px 26px 3px 26px; white-space: nowrap;}
.expandbox .ctrl {
	width:52px; 
	height:22px;  
	position: absolute; 
	right:10px; 
	top:-22px; 
	cursor: pointer;
	}
.expandbox-content {
  /*padding: 30px 20px 20px 20px; */
  overflow:hidden;}
.expandbox-content span {color:#3e3e3e; font-size:14px;}
.expandbox > label, .expandbox fieldset > label {font-size:14px; color:#3e3e3e; display:block;}

/*Teste*/

.expandcollapse-item {
  overflow: hidden;
  border-top:1px solid blue;
}

.expandcollapse-heading-collapsed {
  cursor: pointer;
  z-index: 100000000;
  background: url(../images/bgctrl.png) 0% 0% no-repeat;  
  position: relative;
  
}

.expandcollapse-item:first-of-type {
  border-top:0px;
}


.expandcollapse-heading-collapsed p{
  font-size: 16px;
  font-weight: normal;
  margin:0px;
}



.expandcollapse-heading-expanded {
    cursor: pointer;
	  background: url(../images/bgctrl.png) 0% 100% no-repeat;
    position: relative;
    
}

.expandcollapse-heading-expanded p{
  font-size: 16px;
  font-weight: bold;
  margin:0px;
}

.expandcollapse-heading-collapsed > span,
.expandcollapse-heading-expanded > span {
  position:absolute;
  top: 25px;
  right: 15px;
  font-size: 20px;
  line-height: 0px;
}

.expand-collapse-content {
  padding: 20px;
}


/*
animation:*/

.slideDown.ng-hide {
  max-height:0;
  transition:max-height 0.35s ease;
  overflow:hidden;
  position:relative;
}

.slideDown {
  /*height: 460px;*/
  /*max-height: 500px;*/
  transition:max-height 0.35s ease;
  overflow:hidden;
  position:relative;
}

.slideDown.ng-hide-remove,
.slideDown.ng-hide-add {
  /* remember, the .hg-hide class is added to element
  when the active class is added causing it to appear
  as hidden. Therefore set the styling to display=block
  so that the hide animation is visible */
  display:block!important;
}


.slideDown.ng-hide-add {
  animation-name: hide;
  -webkit-animation-name: hide;  

  animation-duration: .5s; 
  -webkit-animation-duration: .5s;

  animation-timing-function: ease-in;  
  -webkit-animation-timing-function: ease-in;  
}



.slideDown.ng-hide-remove {
  animation-name: show;
  -webkit-animation-name: show;  

  animation-duration: .5s; 
  -webkit-animation-duration: .5s;

  animation-timing-function: ease-out;  
  -webkit-animation-timing-function: ease-out;  
}