body{
    background:#36bec7;
    color:#fff;
    font-family: 'Roboto Condensed', sans-serif;

}
.home p, .enf p {
  text-align: justify ;

}
 .map ul{
  padding:0 !important;
}
.contacto .serv ul, .contacto .serv ul li{
  padding: 0;
}

header.greybg{
    /*height: 541px;*/
    /*background-image: url("../img/banner.jpg");*/
    background-size: cover;
}

.greybg{
  color:#7b7d7f;
  background: #fff;
  padding-top:20px;
  padding-bottom:20px;
}
#ciro.greybg, header.greybg{
  margin-top:0;
  margin-bottom:0;

}
.bluebg{
  background:#36bec7;
  color:#fff;
  padding-top:20px;
  padding-bottom:20px;
}
.lightgrey{
  background: #f4f4f4;
  color:#7b7d7f;

}

.darkgrey{
    background:#303030;
    color:#fff;
}
.long {
  padding:40px 0;
}
/*-------------------------*/
/*MENU*/
/*-------------------------*/
section:first-of-type{
  padding-top: 57px;
}
nav{

  padding: 15px 0;
  color:#7b7d7f;
  background: #fff;
  position: fixed;
  width: 100%;
  z-index: 3;
}
nav ul, nav ul li{
  text-align: center;
  list-style: none;
  padding:0px;
  margin:0px;
}

nav li a{
  /*font-size: 1.3em;*/
  font-size: 1em;
  color:#7b7d7f;
}

nav li a:hover{
  font-size: 1em;
  color:#7b7d7f;
  text-decoration: none;
  border-bottom:2px solid #36bec7;
}


nav.main{

/*  -webkit-box-shadow: 3px 3px 5px 6px #ccc;
  -moz-box-shadow:    3px 3px 5px 6px #ccc;
  box-shadow:         0px 7px box-shadow: 0px 7px 5px #aaa;

  box-shadow: 0px 7px 5px #aaa;

  mix-blend-mode: multiply;
  /*fix betun*/

  /*height: 5em;*/
  height:3.5em;
}
#carouselExampleIndicators{
  margin-top: 50px;
  /*fix betun*/

}
header.greybg .col{
  padding:0;
}

.sombra{
  -webkit-box-shadow: 3px 3px 5px 6px #ccc;  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
  -moz-box-shadow:    3px 3px 5px 6px #ccc;  /* Firefox 3.5 - 3.6 */
  box-shadow:         0px 7px box-shadow: 0px 7px 5px #aaa;

  box-shadow: 0px 7px 5px #aaa;

  mix-blend-mode: multiply;
  /*fix betun*/
  height: 10px;
  /*margin-top: 8px;*/
  margin-top:-16px;
  color:#7b7d7f;
  background: #fff;
  position: fixed;
  width: 100%;
  z-index: 2;
  padding: 36px;


}


#collapseus{
  position: relative;
  z-index: 2;
}
.card{
  position: absolute;
  z-index: 2;
  width: 100%;
}
.card li, ul.card{
  padding-left:0px;
  padding-right: 0px;

}
/*-------------------------*/
/*END MENU*/
/*-------------------------*/
/*-------------------------*/
/*CIRO - HOME*/
/*-------------------------*/
#about img{
}
.asset{
  margin:20px 0;
  background:#f4f4f4;
}
.item{
  background:#b7d57f;
  padding:20px 10px;
}
.asset h3{
  padding-top: 50px;
}

.asset img{
  margin-top: 3em;
  margin-bottom: 3em;
}
.test img{
  margin-bottom: 2em;
}

/*-------------------------*/
/*END CIRO - HOME*/
/*-------------------------*/

/*-------------------------*/
/*END CIRO - EQUIPO*/
/*-------------------------*/

#sergio h1{
color:#5b5c60;
}
#sergio .container{
}
.equipo h1, .equipo h2{
  font-size: 3em;
  font-weight: bold;
}
.equipo h2{
  background: #36bec7;
  color:#fff;
  padding: .2em 0;
  margin-bottom: 0px;
}

.equipo .medicos{
  background: #fff;
  padding-bottom: 2em;
}
.equipo .medicos h4, .equipo .medicos h5, .equipo .medicos h6{
  color:#5b5c60;
}
.equipo .medicos .doc{
  background:#b7d57f;
  padding:1em;
}
.equipo .medicos p{
  color:#7b7d7f;
}
.equipo .med .row{
  padding:0px;
}
.equipo .med .row{
  margin:1em 0;
}
.equipo .medicos h4
{
  font-size:17px;
}
.equipo #carouselExampleIndicators{
  margin-top:0px;
}

/*-------------------------*/
/*END CIRO - EQUIPO*/
/*-------------------------*/
/*-------------------------*/
/*CIRO - SERVICIOS*/
/*-------------------------*/
.servicios h1{
  font-size: 3em;
  font-weight: bold;
  color: #fff;
  text-align: center;
}

.servicios .serv{
  border-bottom: 2px solid #aaa;
  padding: 50px 0;
}
.servicios .serv h2{
  font-size:2em;
  padding-top: 1em;
  font-weight: bold;

}
.servicios .serv p, .servicios .serv li{
  font-size:1.2em;
}
.servicios .serv ul, .servicios .serv ul li{
  list-style: none;
  color:#36bec7;
}
.servicios .ban{
  padding:0px;
}
.servicios .ban img{
  width: 100%;
}

/*-------------------------*/
/*END CIRO - SERVICIOS*/
/*-------------------------*/

/*-------------------------*/
/* CONTACTO */
/*-------------------------*/
  .map{
  }


/*-------------------------*/
/*END CONTACTO*/
/*-------------------------*/
/*-------------------------*/
/*ENFERMEDADES*/
/*-------------------------*/

.normal{
  font-weight:lighter;
}
.enf{
  background: none;

}
#questions ul li ul {
  font-size: unset;
}



.enf #team h2{
  padding: 2em 0 1em 0;
  background: #36bec7;
  color:#fff;
  font-weight: bold;

}

.enf .lup#enf {
  background: url("../img/enfermedades_lupus.jpg");
}
.enf .got#enf {
  background: url("../img/enfermedades_pies.jpg");
}
.enf .der#enf {
  background: url("../img/enfermedades_dermatitis.jpg");
}
.enf .ost#enf {
  background: url("../img/enfermedades_huesos.jpg");
}
.enf .art#enf {
  background: url("../img/enfermedades_manos.jpg");
}
.enf .oste#enf {
  background: url("../img/enfermedades_huesos.jpg");
}

.enf .esp#enf {
  background: url("../img/expondilitis.jpg");
}
.enf .fib#enf {
  background: url("../img/enfermedades_fibromialgia.jpg");
}
.enf .pf#enf {
  background: url("../img/preguntas_frecuentes.jpg");
}
.enf .jor#enf {
  background: url("../img/enfermedades_sindrome_sjogren.jpg");
  background-position: right;
  background-repeat: no-repeat;
}


.enf #enf{
  background-size:cover;
  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
      -moz-animation: fadein 2s; /* Firefox < 16 */
       -ms-animation: fadein 2s; /* Internet Explorer */
        -o-animation: fadein 2s; /* Opera < 12.1 */
           animation: fadein 2s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}


.enf #enf h2{
  margin: 2em;
  background: none;
  color:#fff;
  font-weight: bold;

}
.enf #enf h2 span{
  background-color: #b7d57f;
  /*mix-blend-mode: multiply;*/
  padding:3em;
  /*background-color:rgba(250,193,24,.7);*/
}
.enf .pf#enf h2 span{
  background-color: #36bec7;

  /*background-color:rgba(250,193,24,.7);*/
}

.enf #enf h2 span{
  background-color: #b7d57f;
  /*mix-blend-mode: multiply;*/
  padding:1em;



  /*-------------------------*/
  /*TEST*/
  /*-------------------------*/


  /*background-color:rgba(250,193,24,.7);*/
}
.enf #enf h2 span span{
  mix-blend-mode:normal;
  background: none;
  color: #fff;


}

.bkdg {
    background: url("../img/enfermedades_manos.jpg") center center no-repeat fixed;
    background-size: cover;
    height: 700px;
    width: 700px;
}

.blend {
    position: relative;
    width: 50%;
    height: 50%;
}
.blend::before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  background-color: #b7d57f;
  mix-blend-mode: multiply;
}
.inner {
    position: absolute;
    z-index: 2;
}
h1 {
  color: white;
}
/*-------------------------*/
/*END TEST*/
/*-------------------------*/
#questions{
  padding: 3em 0;
  font-family: 'Roboto Condensed', sans-serif;

}
#questions h2, #questions p, #questions ul{

  color:#606060;

}
#questions p, #questions ul{
  font-size: 1.3em;
  font-weight: 300;
}
#questions h2{
  font-weight: bold;

}
#questions h2{
  margin-top: .6em;
  font-size: 2.6em;
}
#questions .ans{

}

.par #questions .ans{
  background: #f0f0ee;
  padding-top: 2em;
  padding-bottom: 2em;
}
.non #questions .ans{
  background: #36bec7;
  padding-top: 2em;
  padding-bottom: 2em;

  color: #fff;
}


.non #questions .ans p, .non #questions .ans ul {
  color: #fff;
}

#questions i{
  font-size: .5em;
  color:#909090;
  vertical-align: middle;

}
#questions h2[aria-expanded="false"] i.fa-minus-square{
  display: none;
}
#questions h2[aria-expanded="false"] i.fa-plus-square{
  display: inline;
}

#questions h2[aria-expanded="true"] i.fa-minus-square{
  display: inline;
}
#questions h2[aria-expanded="true"] i.fa-plus-square{
  display: none;
}
#questions button.qu{
  text-align: left;
  width:100%;

}
#questions button.qu[aria-expanded="false"] i.fa-minus-square{
  display: none;
}
#questions button.qu[aria-expanded="false"] i.fa-plus-square{
  display: inline;
}

#questions button.qu[aria-expanded="true"] i.fa-minus-square{
  display: inline;
}
#questions button.qu[aria-expanded="true"] i.fa-plus-square{
  display: none;
}





#questions button, .equipo button{
  background: none;
  border: none;
}

#questions .modal-footer button{
  background: #36bec7;
  border: 1px solid #36bec7;
}
/*-------------------------*/
/*END ENFERMEDADES*/
/*-------------------------*/
#questions .row:nth-child(4n+1) h2{
  color:#909090;
}

#bottom{
  padding:60px 0;
}
#bottom ul{
  list-style: none;
}
#bottom a{
  color:#fff;
}


footer{
  padding:30px 0;
  background: #36bec7;
}




/*MOBILE*/
/* Small devices (tablets, 768px and up) */
#hnav{
  display: none;

}
@media (max-width: 767px) {

      #hnav, #hnav a{
        display: block;
        color:#36bec7;
      }
    nav.main{
      height: auto;
      position:relative;


    }
    .sombra{
    position: relative;
    padding:8px;

    }
    #carouselExampleIndicators{
      margin-top: 0px;
    }
    h2{
      font-size: 1.5em;
    }
    #ciro img{
      display: none;
    }


    nav .card{
      position: relative;
    }

    #sergio h1{
      font-size: 2em;
    }

    .equipo h1, .equipo h2{
      font-weight: normal;
      font-size: 2em;
    }

    .row{
      overflow-x: hidden;
      /*gabz - check*/
      /*You should ensure that every .row div is inside a .container div
    and
    you should't have nested container .. row .. container structure*/
    }
    nav .row{
      overflow-x:visible;
    }



    .enf .lup#enf {
      background: url("../img/mob_enfermedades_lupus.jpg");
    }
    .enf .got#enf {
      background: url("../img/mob_enfermedades_pies.jpg");
    }
    .enf .der#enf {
      background: url("../img/mob_enfermedades_dermatitis.jpg");
    }
    .enf .ost#enf {
      background: url("../img/mob_enfermedades_huesos.jpg");
    }
    .enf .art#enf {
      background: url("../img/mob_enfermedades_manos.jpg");
    }
    .enf .oste#enf {
      background: url("../img/mob_enfermedades_huesos.jpg");
    }

    .enf .esp#enf {
      background: url("../img/mob_expondilitis.jpg");
    }
    .enf .fib#enf {
      background: url("../img/mob_enfermedades_fibromialgia.jpg");
    }
    .enf .pf#enf {
      background: url("../img/mob_BANNER_PGF.jpg");
    }
    .enf .jor#enf {
      background: url("../img/mob_enfermedades_sindrome_sjogren.jpg");
    }
    .enf #enf{
       background-position: center !important;
    }
    #questions h2{
      margin-top: .3em;
      font-size: 2.0em;
    }
    .enf h2{

      font-size: 1.0em;
    }
    section:first-of-type {
        padding-top: 0px;
    }

}

/*END MOBILE*/

.map.first{
  margin-bottom: 5em;
}
.map{
  padding:1em;
}
#team.greybg .col{
  padding:0px;
}

.serv .row img{
  top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   position: absolute;

}

.form-group{
  margin: 1em 0;
}
#forma, #formc{
  margin: 1em auto;
  padding-top:1em;
  padding-bottom: 1em;
}
#formc .btn, #forma .btn{
  float:right;
}
#forma, #formc .btn{
  background:  #b7d57f;
  color:#5b5c60;
}