/* acciones sociales*/





  .top-accsoc {max-height: 495px; overflow: hidden;}



  .top-accsoc img{width: 100%; height: auto; }





  .subaccsoc{background-color: #222; border-bottom: #333 solid 1px;}







.subaccsoc .submenu{float: right; padding-bottom: 0; margin-bottom: 0;}



  @media (max-width: 1140px;){.subaccsoc{background: red!important;}}



.subaccsoc .submenu a{   font-family: 'Varela Round', sans-serif; 

color: #F6F127; 

font-size: 12px; text-decoration: none;}

.subaccsoc .submenu a:hover{color:#fff!important ;}



.ayuda-quirurgica .aq-link a,

.campanias .camp-link a,

.porgramas-as .pro-link a,

.testimonios .test-link a,

.colaboradores .col-link a,

.resultados .res-link a {color:#fff!important ;}


/*
.subaccsoc .sumate{

  font-family:'DIN Medium', Helvetica, Arial, sans-serif; 

  display: inline-block; 

  padding: 5px 20px;

  float: right; 

  color:#fff;

  border-left: solid 1px #666;

  border-right: solid 1px #666; 

font-size: 14px;



margin-right: 45px;

}*/

/*
.colabore .sumate{

  font-family:'DIN Medium', Helvetica, Arial, sans-serif; 

  display: inline-block; 

  padding: 5px 20px;

  float: right; 

  color: #000;

  background: #F6F127;

font-size: 14px;
text-decoration: none;



margin-right: 25px;

}


  .subaccsoc .sumate{

    background: #F6F127;

    color: #000;

    text-decoration: none;



  }


*/
  .accionsocial h2.result, .obrassociales h2.result, .title-sep{background: #fe5e5e;

  font-size: 24px; 

    color: #fff; 

    padding: 10px; 

    font-family: 'Roboto', sans-serif;

    text-align: center; margin-top: 0;height: 45px;z-index: 10;}









  .restriangulo { width: 30px; height: 30px;background: #fe5e5e;  margin-top: -35px!important; margin: 0 auto;

    z-index: -1; position: relative;



    -webkit-transform: rotate(45deg);

  -moz-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg);}



  .accionsocial #resultados  p, .obrassociales   p{

    font-family:'DIN Bold', Helvetica, Arial, sans-serif; 

    text-align: center;

    max-width: 400px;

    margin: 10px auto;

    padding: 10px;

    

  }



.boxconter { margin-top: 65px; margin-bottom: 65px; overflow: hidden;}



.boxconter > div{ padding: 0;}



.boxconter p {color: #333; display: block;  height: 45px; padding: 20px 20px!important;   }



  .inconter{text-align: center;border-left: solid 1px #D8D8D8; margin: 0 auto; width: 100%;}



.servsoc  { border-left: none;}



  .inconter .number {

    float: left; 

    color: #fff; 

    margin: 2px;

    display: block;

    background: #000; 

    font-size: 110px;

    position: relative; overflow: hidden;

      padding: 40px 12px 15px 12px;
        line-height: 60px;
  vertical-align: middle;

   

   

    font-family:'DIN Bold', Helvetica, Arial, sans-serif;    

        -webkit-border-radius: 8px;

border-radius: 8px;

  }



  .number span, .number strong{margin-top: -25px; display:block; margin-bottom: -45px; z-index: 1}

  .number hr{ color: green; z-index: 5;border: 2px #000 solid; position: absolute; top: 34px; display: block; width: 100%;

   }


.inconter .number br{height: 0px; display: none;}


  .inconter .vermasconter{ 

    clear: both; 

    display: inline-block; 

    background:#fe5e5e; 

    padding:4px 10px 0px 10px;

     color: #fff; 

     font-family:'DIN Medium', Helvetica, Arial, sans-serif;

     text-transform: uppercase;

     font-size: 16px;

     margin-top: 35px;

   }

   .inconter h3{font-family:'DIN Medium', Helvetica, Arial, sans-serif !important; 

   color: #fe5e5e; margin-bottom: 15px; font-size: 24px;}



   .inconter ul{padding: 0; margin: 0 auto; display: inline-block; clear: both; height: auto; overflow: hidden;}



   .anteojentre .vermasconter{background: #ea8245}

   .anteojentre h3{ color: #ea8245;}



   .ninaten .vermasconter{background: #fdc043; clear: both;}

   .ninaten h3{ color: #fdc043;}





   .boxcall img{max-width: 100%; position: relative; height: auto; }









/* seccion calll action */

.callactionsocial{margin-top: 95px; border-top: 18px solid #F6F127; padding-top: 35px; }

   .col-call{padding: 0!important;}



.boxcall h3 {font-family: 'Gotham-Regular'!important; font-size: 14px; 

background: #000; color: #fff;  display: inline-block; padding: 5px 10px; position: absolute; bottom: 0px; margin: 0; }

   



   .boxcall:hover h3{background: #fe5e5e; }



   .testimonio h2 { font-size: 32px; position: absolute;color: #fff; z-index: 2; left: 24px; top: 45px; margin-right: 35px; max-width: 70%;}





.calliconos {margin-top: 30px; text-align: center; 

  margin-bottom: 95px;overflow: hidden; height: auto;}



.calliconos  a:hover{text-decoration: none;}



.calliconos h2{ color: #848484; font-size: 24px;text-decoration: none;}



.calliconos a:hover h2{ color: #fe5e5e;}



.calliconos .icon { 

  background: url("../images/iconos-callaction.png") no-repeat; background-size: 300% auto; 

height: 160px; max-width: 320px; margin: 0 auto;}



.calliconos a:hover .icon-colaboradores{background-position: 0px -200px;}



.calliconos .icon-programas{background-position: -320px 0px;}

.calliconos a:hover .icon-programas{background-position: -320px -200px;}



.calliconos .icon-sumate{background-position: -640px 0px;}



.calliconos a:hover .icon-sumate {background-position: -640px -200px;}



/*programas de accion social*/



body.porgramas-as{}



body.porgramas-as .content h3{

    color: #fcb316;

  text-align: center;

  font-weight: 700;

  font-size: 26px;

  

  margin-bottom: 45px;

  letter-spacing: -1px;

  font-family: 'Roboto', sans-serif;

}



body.porgramas-as .cont{max-width: 850px; margin: 0 auto; }



body.porgramas-as .inconter .number{

  font-size: 42px;

  padding: 20px 2px 20px 2px;

  height: auto;

    -webkit-border-radius: 4px;

  border-radius: 4px;

}

 body.porgramas-as .number strong {
  margin-top: -25px;
  
  margin-bottom: -45px;
  z-index: 1;
  font-weight: normal;
}






body.porgramas-as .number hr {

  top: 0px;

  border-width: 1px;



}



body.porgramas-as .boxconter{ margin-bottom: 85px;}



body.porgramas-as h5{

  font-family: 'Roboto', sans-serif;

  font-weight: 300;

  font-size: 18px;

  color: #878787;



}



body.porgramas-as .nos-images{margin-bottom: 40px; margin-top: 0px; overflow: hidden;clear: both;}



section.programas-intro { margin-bottom: 0px; margin-top: 30px; padding: 0px 55px;}



section.programas-intro .content{ max-width: 1200px; margin: 35px auto; 

  border-bottom:#ccc solid 1px; padding-bottom: 35px; overflow: hidden; }

section.programas-intro h1{ text-align: center; color: #f89520;

 font-size: 34px;font-family: 'Roboto', sans-serif;



}



section.programas-intro h4{ text-transform: none;color: #f89520; 

  font-family: 'Roboto', sans-serif;

  font-size: 22px; margin-top: 20px;}



body.porgramas-as section p{font-family: 'Roboto', sans-serif; 

font-size: 18px; word-spacing: -2px; color: #424242;}



 i.numero-list{ background: #fcb316; color: #fff;  

  padding: 0px 5px; height: 30px; width: 30px;

  display: inline-block; 

  text-align: center; font-size: 24px; font-style: normal;

  font-family: 'Roboto', sans-serif;

webkit-border-radius: 50px 50px 50px 50px!important;

border-radius: 50px 50px 50px 50px!important;}





.proli{ border-bottom: none!important; max-width: 1200px; margin: 0 auto;}

ul.linkspro{ margin-top: 20px;  }

ul.linkspro li{ display: block; float: left; text-align: center; width: 33.33%; }

ul.linkspro h3{ font-size: 28px;}



ul.linkspro li i{clear: both;}

ul.linkspro li a{color: #000;}

ul.linkspro li a:hover {color: #f89520; text-decoration: none;}



body.porgramas-as .title-sep{ background: #f89520; font-size: 28px; padding: 14px; height: 55px;}



body.porgramas-as .restriangulo{background: #f89520; margin-bottom: 140px;}





#vpa, .ancla{clear: both; display: block; height: 75px;}

body.porgramas-as .vpa  h3, body.porgramas-as .etapas  h3 {color: #f89520;font-family: 'Roboto', sans-serif;

text-align: center;

 }

 body.porgramas-as .etapas  h3 {margin-top: 35px; }



body.porgramas-as .objetivos{margin-top: 54px;}



body.porgramas-as h3 {font-family: 'Roboto', sans-serif;}



body.porgramas-as .etapas strong{color: #f89520;font-family: 'Roboto', 

sans-serif; font-weight: normal;}



body.porgramas-as .etapas p{color: #666;}



.vpa .content{max-width: 1300px; margin: 35px auto;}

.vpa .content ul{text-align: center;}

.vpa .content ul li{font-family: 'Roboto', sans-serif; 

font-size: 18px; word-spacing: -2px; 

display: inline-block; margin-bottom: 20px; position: relative;

}



.vpa .content ul li i{ color: #fcb316; 

  font-size: 45px;

  margin-left: -15px;

  top: 10px;

  left: -5px;

  position: relative;

  height: 0px;line-height: 0px; padding-top: 35px;

}







.volver-a-ver .restriangulo{ margin-bottom: 50px!important;}

.volver-a-ver .content{ max-width: 1000px; margin-top: -120px; display: block;

  margin: 0 auto; padding: 25px; text-align: center;}



.volver-a-ver p.black i{ color: #fcb316; 

  font-size: 45px;

  margin-left: -15px;

  top: 10px;

  left: -5px;

  position: relative;

  height: 0px;line-height: 0px; padding-top: 35px;

}



.volver-a-ver .content > div > h4, .volver-a-ver .content >  h4 {

  font-family: 'Roboto', sans-serif;

  margin-top: 65px;

  color: #000;

  font-size: 26px;

  font-weight: 600;

}



.volver-a-ver .content .oasis{ border: solid 3px #fcb316;

  overflow: hidden; margin-top: 45px; margin-bottom: 65px;

  }



.volver-a-ver .content .oasis img{float: left; 

  border-right:solid 3px #fcb316; margin-right: 35px;

  width: 50%;

   }



   .volver-a-ver .content .oasis p{color: #fcb316; font-size: 18px; font-weight: 500; 

    padding: 25px 35px 0px 0px; text-align: left;  }







    .benefi{ border: #cecece 1px solid; padding-bottom: 54px; 

      border-left: none; border-right: none;}





     .vavres h6 {background:#fcb316; color: #fff!important;

       font-family: 'Roboto', sans-serif; margin-bottom: 0px;

      font-weight: 600!important; padding: 10px; font-size: 26px; }



      .vavres .datos-slide .conte{ padding:10px 250px;}









.etapa-cont{ vertical-align: middle; margin-top: 90px;  }



.etapa-right{ text-align: right;}

.etapas { border-top: solid 22px #fcb316;border-bottom: solid 22px #fcb316;}



.etapas .content{max-width: 1000px; margin: 0 auto;}



.etapa-item {

  overflow: hidden;

  vertical-align: middle;

  border-bottom: #e5e5e5 solid 1px; 

  overflow: hidden;

  margin: 0 auto;

  max-width: 1200px;

}



.etapa-item h6{font-family: 'Roboto', sans-serif; font-size: 18px; color: #fcb316; }

.etapa-item p{font-family: 'Roboto', sans-serif;}



.etapas .feature{

  vertical-align: middle;



  width: 250px;

  height: 250px;

  -webkit-border-radius: 1000px 1000px 1000px 1000px;

border-radius: 1000px 1000px 1000px 1000px;

overflow: hidden;

margin-bottom: 30px;

margin-right: 55px;

margin-top: 35px;



}



.etapa-right .feature{margin-right: 0px; margin-left: 55px;}

.etapas .feature img {height: 100%; width: auto;}

.left {float: left;}

.right{float: right;}







.manuales{border-bottom: solid 22px #fcb316; padding: 70px 15px;}



.manuales .content{ margin: 0 auto; text-align: center; max-width: 1200px;}



.manuales p{margin-bottom: 35px;}







section.silder-programa{}



section.silder-programa .content{ max-width: 1000px; margin: 25px auto;}

.image-slid { height: 380px; overflow: hidden; max-width: 100%;}

.image-slid img{ height: 400px;}





section.silder-programa h2{font-family: 'Roboto', sans-serif;

  font-size: 26px;

  text-align: center;

  

  width: 1000px;

  font-weight: 600;}



section.silder-programa h3{ margin-top: 75px;}

.sliderpro{ background: #fcb316; position: relative;padding: 15px;  }



#proslider{position: relative; width: 100%;  }

.sliderpro .caroufredsel_wrapper{margin-top: -25px!important;}



#proslider .slide{ width: 100%;}



.pagpro {position: absolute;top: 0; left: 15px; right: 15px; z-index: 20;}

.pagpro ul{padding: 5px 20px;}





.pagpro li{ width: 33.33%; 

  float: left; display: inline-block;

  font-family: 'Roboto', sans-serif;

  font-size: 26px;

  color: #85692d;

  font-weight: 600;

}

.pagpro li.select{ color: #fff;}



.alignleft{text-align: left;}

.aligncenter{text-align: center;}

.alignright{text-align: right;}



.pagpro .arrow{ width: 40px; 

  height: 40px; background: url("../images/slidpro.png");

cursor: pointer;

}



.pagpro .right {background-position: right;}



.datos-slide {background: #FFF;  width: 100%; height: 150px; text-align: center;}



.datos-slide .conte{ margin: 0 auto; padding:10px  105px;}

.datos-slide .desc-pro{ float: left;  width: 150px;  }



.datos-slide h4{color: #fcb316;

  text-align: center;

  font-weight: 700;

  font-size: 26px;  

  letter-spacing: -1px;

  font-family: 'Roboto', sans-serif;}



.datos-slide h5{margin-top: 15px;}





.silder-programa h6{  font-family: 'Roboto', sans-serif;

  margin-top: 65px;

  text-align: center;

  color: #000;

  font-size: 26px;

  font-weight: 600;}



  .silder-programa .detalles{ font-family: 'Roboto', sans-serif; display: inline-block; background: #fcb316; 

    font-size: 14px; padding: 10px 18px; color: #fff; text-align: center; margin: 15px auto; font-weight: 500;}



    .silder-programa .detalles:hover{text-decoration: none; background: #fcb319; }



/* section ayuda quirurjica*/

section.ayudaq{margin-top: 30px;}

section.ayudaq h2{text-align: center; 

    color: #f9a776;

  font-size: 26px;

  font-family: 'Roboto', sans-serif;

  font-weight: 500;

  margin-top: 10px;}



.ayuda-quirurgica .title-sep{background: #f9a776;

  font-family: 'Roboto', sans-serif;

  font-size: 26px; padding: 15px; height: 55px; margin-top: 0px;}

.ayuda-quirurgica .restriangulo{background: #f9a776;}

section.ayudaq .content{max-width: 960px; margin: 35px auto;}





.bajada-aq{ max-width: 1200px;margin: 55px auto; 

  text-align: center; overflow: hidden;

font-family: 'Roboto', sans-serif;

}

.features-aq {padding: 0px 15px; margin-bottom: 25px;}

.features-aq div {padding: 0!important;}

.features-aq div img{ max-width: 100%; height: auto;}



.tipos-ayuda{margin: 55px; height: auto; overflow: hidden; margin-bottom: 80px;}



.tipos-ayuda h4{font-size: 24px; font-family: 'Roboto', sans-serif;

  text-transform: none; color: #fab57a;}

.tipos-ayuda h4 i{ background: #fab57a; color: #fff;  

  padding: 10px 5px; height: 40px; width: 40px;

  display: inline-block; 

  margin-right: 20px;

  text-align: center; font-size: 20px; font-style: normal;

webkit-border-radius: 50px 50px 50px 50px!important;

border-radius: 50px 50px 50px 50px!important;}



.tipos-ayuda p{ min-height: 100px; padding: 0px 15px;}



.tipos-ayuda .parc h4 { color: #f8a65d;}

.tipos-ayuda .parc h4 i, .tipos-ayuda .parc .consult{background: #f8a65d;}



.tipos-ayuda .total h4 { color: #f37e6a;}

.tipos-ayuda .total h4 i, .tipos-ayuda .total .consult{background: #f37e6a;}







a.consult{ display: inline-block; background:#FCBF7E; padding: 3px 15px;

font-family: 'Roboto', sans-serif; font-size: 14px;

 text-transform: uppercase; color: #fff; margin: 5px 15px;}



 a.consult:hover { text-decoration: none; color: #eee;}



body.ayuda-quirurgica p{font-family: 'Roboto', sans-serif; font-size: 18px; word-spacing: -2px;}



.tipos-ayuda > div {}

.tipos-ayuda > div + div{ border-left: solid 1px #999;}









.cirugias{ border-top: solid 1px #d0d2d3; padding-top: 90px;}



.tcirugias{ border-left: solid 1px #d0d2d3; 

  float: left; padding-left: 65px; }

.tcirugias div{ float: left; text-align: center; margin-right: 45px; }

.tcirugias h3{

  font-family: 'Roboto', sans-serif; 

font-weight: 500;

color: #adadad;

padding: 0;

margin: 0;



}

.tcirugias h4{

  color: #f37e6a;

  font-family: 'Roboto', sans-serif; 

font-weight: 700;

font-size: 100px;

letter-spacing: -10px;

margin-bottom: 0px;

padding-bottom: 0px;

margin-left: -15px;

}

.tcirugias div p{

  color: #f8a65d;

  font-family: 'Roboto', sans-serif; 

  text-transform: uppercase;

  margin-top: 0px;

  padding-top: 0px;

  margin: 0;

  padding: 0;



font-size: 20px;

}







body.ayuda-quirurgica .text-left{ overflow: hidden; }



.text-left p{font-family: 'Roboto', sans-serif; }





.evalua { margin-top: 65px!important; border-top: solid 1px #D1D2D4;

  border-bottom: solid 1px #D1D2D4; 

  margin:15px; overflow: hidden; height: 220px; }



.evalua .aspectos{ color: #fff; background: #f8a65d; width: 30%;float: left; 

padding: 50px 50px; text-align: left; margin-right: 20px; position: relative; }





.evalua .aspectos .triangulo { width: 30px; height: 30px;

  background: #F8A65D; position: absolute; right: -15px; top: 100px;   





    -webkit-transform: rotate(45deg);

  -moz-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg);}



.evalua .aspectos h4{ font-size: 18px; line-height: 25px;

  font-family: 'Roboto', sans-serif;}



.evalua .aspectos h4 span{ text-decoration: underline;}





.asp1 h5,.asp2 h5{ position: relative; font-size: 17px;

font-family: 'Roboto', sans-serif;

text-transform: none;

}

.asp1 h5 i,.asp2 h5 i{ position: absolute; left: -50px; top: 0; 

  background: #000; font-size: 18px; width:35px; height: 35px; padding: 10px; }



.asp1,.asp2{float: left; height: auto; overflow: hidden; 

  width: 25%; padding:90px 10px 60px 90px;}



.asp1 p,.asp2 p{font-size: 14px!important; 



font-family: 'Roboto', sans-serif;

text-transform: none;

}



.comoapl { float: left; }



.comoapl a{font-family: 'Roboto', sans-serif;

color: #fff;background: #F8A65D; 

display: inline-block; padding: 5px 15px; font-size: 18px;

text-align: center; vertical-align: middle; 

margin-top: 105px; margin-left: 45px;

text-transform: uppercase;

}

.comoapl a:hover{color: #fff; text-decoration: none;}



.fin-aq{border-bottom: solid 35px #000;}



/* OBRAS SOCIALES*/



.osbody{background: #fff!important;}

.obrassociales h2.result{ background: #00548f!important; margin-top: 30px;

  font-family: 'Roboto', sans-serif; font-size: 26px; height: 50px;



}



.obrassociales p{font-family: 'Roboto', sans-serif; 

font-size: 18px; max-width: 500px ; margin-top: 35px;}



.obrassociales .restriangulo{background: #00548f!important;}



.oscont {margin: 34px 25px 50px 25px; padding-top: -2px!important; overflow: hidden; pa  }



ul.oslist{ padding: 0; margin: 0;  

  overflow: hidden; position: relative; width: 101%; margin-bottom: -1px;}

ul.oslist li{ float: left; display: block; overflow: hidden;

  width: 16.6%;

  max-height: none; 

  border: solid 1px #ccc;margin: -1px;}

ul.oslist li h3{display: none;}

ul.oslist li img{ max-width: 100%; height: auto; aspect-ratio: 1;}





@media(max-width: 1000px){

  ul.oslist li{ width: 25%; height: auto; }

}



@media(max-width: 800px){

  ul.oslist li{ width: 33.3333%; height: auto;}

}

@media(max-width: 600px){

  ul.oslist li{ width: 50%; height: auto;}

}



@media(max-width: 400px){

  ul.oslist li{ width: 100%;}

}