/********************************************************************************
*                             BEM Methodology                                   *
*  [$] Block = block                                                            *
*  [$] Element = block__element                                                 *
*  [$] Modifier = block__element--modifier                                      *
*                                                                               *
*                             Accordion Component                                     *
*                                                                               *
*  [^]                                              *                                                             
*  [^]
*  [^]
*                                                                               *
*                                                                               *
*                                                                               *
*                                                                               *
********************************************************************************/


/* [$] Element *****************************************/
    

.accordion * {
    transition: all .3s ease 0s;
  }
  .accordion__title{
      text-align:center;
  }
  
  .accordion__panels {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    overflow: hidden;
  }

  .accordion__panel-background-image  {
      background-size: cover;
  }
  
  .accordion__panel  {
      position: relative;
      width: 100%;
      min-height: 450px;
  }
  
  .accordion__panels:hover article {
    flex: initial;
    width: 10%;
  }
  
  .accordion-2 .accordion__panels article:hover {
    width: 90%;
  }
  
  .accordion-2 .is-accordion-hovering article:nth-last-child(1) {
    width: 90%;
  }
  
  .accordion-3 .accordion__panels article:hover {
    width: 80%;
  }
  
  .accordion-3 .is-accordion-hovering article:nth-last-child(1) {
    width: 80%;
  }
  
  .accordion-4 .accordion__panels article:hover {
    width: 70%;
  }
  
  .accordion-4 .is-accordion-hovering article:nth-last-child(1) {
    width: 70%;
  }
  
  .accordion-5 .accordion__panels article:hover {
    width: 60%;
  }
  
  .accordion-5 .is-accordion-hovering article:nth-last-child(1) {
    width: 60%;
  }
  
  .accordion-6 .accordion__panels article:hover {
    width: 50%;
  }
  
  .accordion-6 .is-accordion-hovering article:nth-last-child(1) {
    width: 50%;
  }
  
  .accordion__panels article > .accordion__panel__text {
    opacity: 0;
    transition: opacity .2s ease 0;
  }
  
  .accordion__panels .accordion__panel:hover > .accordion__panel__text {
    opacity: 1;
    transition: opacity .3s ease .3s;
    position: relative;
  }
  
  .accordion__panels .accordion__panel:hover > .accordion__panel__title {
      -ms-transform: scale(0); /* IE 9 */
      -webkit-transform: scale(0); /* Safari */
      transform: scale(0); /* Standard syntax */
   
  }
  
  .accordion__panels:hover .accordion__panel__text {
      transform: scale(0); /* Standard syntax */
  }
  
  .accordion__panels .accordion__panel:hover > .accordion__panel__text {
      -ms-transform: scale(1); /* IE 9 */
      -webkit-transform: scale(1); /* Safari */
      transform: scale(1); /* Standard syntax */
      position: relative;
   
  }

  .accordion__panels:hover .accordion__panel__title {
     font-size:0.7em;
  }
  
  .accordion__panel > .accordion__panel__title {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center;
      font-size: 1.3em;
      
  }
  
  .accordion__panel__text {
      text-align: justify;
      position: absolute;
      padding: 90px 200px 0 200px;       
      height: 300px;
  }

/* [#] md screen */
@media (min-width: 992px) and (max-width: 1199px) {
  
  .accordion__panel > .accordion__panel__title {
     font-size: 1.2em;
  }

  .accordion__panels:hover .accordion__panel__title {
      font-size:0.7em;
  }
     .accordion__panel__text {
      padding: 70px 30px 0 30px;        
  }
  
}

/* [#] sm screen */
@media (max-width: 991px) and (min-width: 768px){
  

  .accordion__panels {
    min-height: 350px;
  }
  
  .accordion__panels .accordion__panel > .accordion__panel__title {
      font-size: 1.3em;
  }
  
  .accordion__panels:hover .accordion__panel__title {
     font-size:0.6em;
  }
  
  .accordion__panel__text {
      padding: 70px 30px 0 30px;        
  }

}
/* [#] xs screen */
@media (max-width: 767px) {

  .accordion__panels:hover .accordion__panel__title {
     font-size: 1em;
  }

  .accordion__panels {
      flex-direction: column;
  }

  .accordion__panels:hover .accordion__panel{
      width: 100%;
  }

  .accordion__panel:hover {
    height: auto;
  }

  .accordion__panel__text {
      text-align: center;
      margin: auto;
      height: auto;
  }
  
  .accordion__panel  {
      min-height: 300px;
  }
  
  .accordion__panel__text {
      padding: 0 30px;        
  }

  .accordion-2 .accordion__panels article:hover , .accordion-2 .is-accordion-hovering article:nth-last-child(1),
  .accordion-3 .accordion__panels article:hover , .accordion-3 .is-accordion-hovering article:nth-last-child(1),
  .accordion-4 .accordion__panels article:hover , .accordion-4 .is-accordion-hovering article:nth-last-child(1),
  .accordion-5 .accordion__panels article:hover , .accordion-5 .is-accordion-hovering article:nth-last-child(1),
  .accordion-6 .accordion__panels article:hover , .accordion-6 .is-accordion-hovering article:nth-last-child(1){
    width: 100%;
  }

  
}

.background-color-orange{
  background-color: #F26522;
}

.background-color-blue{
  background-color: #00529E;
}

.background-color-cyan{
  background-color: #9CAFD6;
}

.background-color-white{
  background-color: #ffffff;
}

.color-white{
  color:#ffffff;
}

.color-white > p{
  color:#ffffff;
}

.banner__title--section-h2{
  font-size: 36px!important;
}

@media (min-width: 78.375em){
.eib-layout--thirds .eib-layout__col{
  box-sizing: border-box!important;
  padding-right: 0.8333333333em!important;
  padding-left: 0.8333333333em!important;
  width: 33%!important;
  margin-top: 0!important;
}
}
}
/* [$] Modifier ****************************************/



