/* Estilo Grid */
#carousel_blog{ padding: 55px 0;}
#carousel_blog .item_blog{margin: 0 10px}
#carousel_blog .summary_blog h2{ margin: 15px 0; font-size: 15px; letter-spacing: 2px; text-transform: uppercase; color: #8C857B;} 
#carousel_blog .summary_blog .btn_sblo{font-size: 15px;font-weight: 500;text-transform: uppercase;letter-spacing: 4px;color: #8C857B;border:2px solid #8C857B;border-radius:15px;padding: 10px 25px }

.carousel_blog .swiper-button-prev{left: -65px}
.carousel_blog .swiper-button-next{ right: -65px}

h3.module-title,h3.widget-title{ margin-bottom: 25px; margin-bottom: 20px}

.banner_img_atm img{ width: 100%}
.banner_img_atm figure{ position: relative; overflow: hidden}
.banner_img_atm figure .cont_banner,.banner_img_atm figure .custom-image-overlay{ position: absolute; width: 100%;height: 100%; top: 0; left: 0px}
.banner_img_atm figure .custom-image-overlay{z-index: 1}
.banner_img_atm figure .cont_banner{z-index: 91; padding: 15px;display: flex;flex-wrap: wrap;}
.banner_img_atm figure .cont_banner .custom-button{ display: table}

/**CARUSEL**/

.swiper-container {
    width: 100%;
    margin: 0 auto; overflow: hidden; 
}

.swiper-slide {
    text-align: center;
    background: transparent!important;
    /* centrar los elementos */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

#slider_porta .owl-nav{ display: flex; justify-content: center; align-content: center;  }
#slider_porta .owl-nav button{ width: 40px; height: 40px;  border-radius: 0px; color: #fff!important;  line-height: 33px; margin:  0 10px; position: absolute;top: 0;bottom: 0; margin: auto; display: table}
#slider_porta .owl-nav button span{font-size: 45px; width: 40px; height: 40px;  display: block}
#slider_porta .owl-nav button:hover{   background: #8C857B!important}
#slider_porta .owl-nav .owl-prev{left: 30px;  }
#slider_porta .owl-nav .owl-next{ right: 30px} 


#carousel_blog .owl-nav{ display: flex; justify-content: center; align-content: center;  }
#carousel_blog .owl-nav button{ width: 40px; height: 40px;  border-radius: 0px; color: #8C857B!important;  line-height: 33px; margin:  0 10px; position: absolute;top: 0;bottom: 0; margin: auto; display: table}
#carousel_blog .owl-nav button span{font-size: 45px; width: 40px; height: 40px;  display: block}
#carousel_blog .owl-nav button:hover{   }
#carousel_blog .owl-nav .owl-prev{left: -50px;  }
#carousel_blog .owl-nav .owl-next{ right: -50px} 
#carousel_blog.owl-carousel .owl-stage-outer{ padding-bottom: 35px}

#slider_porta .swiper-slide{position: relative}

#slider_porta .swiper-slide img{ width: 100%; max-width: 100%}
#slider_porta .swiper-slide .text{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; background:rgba(28,50,65,70%); display: flex;align-items: flex-start;flex-direction: column;flex-wrap: wrap;justify-content: flex-end; padding: 40px 15%}

/****FLIP CARD****/
.flip-card {
  background-color: transparent;
  perspective: 1000px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front .title_front{text-shadow: 1px 2px 3px rgba(0,0,0,55%)}
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
    display: flex; overflow: hidden
}

.flip-card-back {
  transform: rotateY(180deg);
}


.accordion {
 
}

.cont_acord { max-width: 1170px;flex-direction: column;}
.at-tab {
  display: none;
 



}

.at-title {
  cursor: pointer;

  position: relative;
  transition: background-color 0.3s ease;
}
.list_btn_tabs{display: flex;flex-direction: row;   flex-wrap: wrap;align-content: center;align-items: center; margin-bottom: 35px; width: 100%}
.list_btn_tabs .text_list_btn{ text-transform: uppercase; font-size: 20px; font-weight: 600}

.at-title:hover {

}

.at-title h2:after {
  content: "+";
  position: absolute;
    font-weight: 200;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  transition: all 0.3s ease;
  font-size: 80px; color: #FFFCF8;
}

.at-title.active h2:after {
  content: "-";
}

.at-item {
 
}

.at-title h2 {
  font-size: 22px; 
  font-weight: 600;
border-bottom: 2px solid #FFFCF8; position: relative;
  margin: 0;
}

.accordion-header {
  text-align: center;
  background-color: #222222;
  color: white;
  padding: 20px 0;
}

#list_portfolio{ display: flex; flex-wrap: wrap;justify-content: center; align-items:flex-start}
#list_portfolio.diapositivas article{ width: calc(50% - 20px); margin: 0px 10px 20px 10px; position: relative}
#list_portfolio.columns_2 article{ width: calc(50% - 20px); margin: 0px 10px 20px 10px; position: relative}
#list_portfolio.columns_3 article{ width: calc(33.333% - 20px); margin: 0px 10px 20px 10px; position: relative}
#list_portfolio article .text_card{position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; padding: 50px}

#list_portfolio article .link_card{ position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; opacity: 0;padding: 50px}
#list_portfolio article .link_card:hover{opacity: 1}
#list_portfolio article .link_card h4,#list_portfolio article .link_card h3{position: relative; z-index: 90; color: #fff; text-transform: uppercase}
#list_portfolio article .link_card h4{ margin-bottom: 15px; font-size:14px }
#list_portfolio article .link_card h3{font-size: 30px; font-weight: 600}
#list_portfolio article .link_card .ico_link{ fill:#fff; position: absolute; right: 40px; bottom: 40px;}

@media only screen and (max-width: 1440px){
    
    
}

@media only screen and (max-width: 1350px){
    
}


@media only screen and (max-width: 1280px){


 
}
@media only screen and (max-width: 1170px){

}
@media only screen and (max-width: 1024px){ 
    #slider_porta .swiper-slide .text{ padding: 40px 10%}
    .swiper-button-next, .swiper-rtl .swiper-button-prev{ display: none!important}

}

@media only screen and (max-width: 980px){

   
}
@media only screen and (max-width: 800px){
  
}

@media only screen and (max-width: 767px){
   #carousel_blog .owl-nav button{ transform: translateY(-50px)}
#carousel_blog .owl-nav button span{font-size: 45px; width: 40px; height: 40px;  display: block}
    .list_btn_tabs{justify-content: center}
#carousel_blog .owl-nav .owl-prev{left: -40px;  }
#carousel_blog .owl-nav .owl-next{ right: -40px} 
#carousel_blog.owl-carousel .owl-stage-outer{ padding-bottom: 35px}
    #list_portfolio article{ width: calc(100% - 20px)!important; margin: 0px 10px 20px 10px; position: relative}
}