.wrapper-infografia {
  position: relative;
  margin: auto;
  height: 600px;
  width: 670px;

  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
          align-items: center;
}




/* SET: COLORS */
.bg-circle-0 {
  background: #0079c2;
}
.bg-circle-0 p {
  color: white;
}
.bg-circle-0 p span {
  color: #6fbfed;
}
.txt-0 {
  color: #0079c2;
}


.bg-circle-1 {
  background: #e5007d;
}
.bg-circle-1 p {
  color: white;
}
.bg-circle-1 p span {
  color: #f986ea;
}
.txt-1 {
  color: #e5007d;
}


.bg-circle-2 {
  background: #40837a;
}
.bg-circle-2 p {
  color: white;
}
.bg-circle-2 p span {
  color: #34d1b9;
}
.txt-2 {
  color: #40837a;
}


.bg-circle-3 {
  background: #e7441e;
}
.bg-circle-3 p {
  color: black;
}
.bg-circle-3 p span {
  color: white;
}
.txt-3 {
  color: #e7441e;
}


.bg-circle-4 {
  background: #f087b6;
}
.bg-circle-4 p {
  color: black;
}
.bg-circle-4 p span {
  color: white;
}
.txt-4 {
  color: #f087b6;
}


.bg-circle-5 {
  background: #05a998;
}
.bg-circle-5 p {
  color: black;
}
.bg-circle-5 p span {
  color: white;
}
.txt-5 {
  color: #05a998;
}


.bg-circle-6 {
  background: #98ca4a;
}
.bg-circle-6 p {
  color: black;
}
.bg-circle-6 p span {
  color: white;
}
.txt-6 {
  color: #98ca4a;
}



.box-0 .box-icons a:hover, .item-0 .icons a:hover {
  color: #0079c2 !important;
}
.box-1 .box-icons a:hover, .item-1 .icons a:hover {
  color: #e5007d !important;
}
.box-2 .box-icons a:hover, .item-2 .icons a:hover {
  color: #40837a !important;
}
.box-3 .box-icons a:hover, .item-3 .icons a:hover {
  color: #e7441e !important;
}
.box-4 .box-icons a:hover, .item-4 .icons a:hover {
  color: #f087b6 !important;
}
.box-5 .box-icons a:hover, .item-5 .icons a:hover {
  color: #05a998 !important;
}
.box-6 .box-icons a:hover, .item-6 .icons a:hover {
  color: #98ca4a !important;
}
/* END: COLORS */


/* SET: MINI CIRCLES */
.wrapper-main-content-pieces #tab1 section.wrapper-infografia .circle-mini {
  width: 20px !important;
  height: 20px;
  border-radius: 50%;
  color: white;
  position: absolute;
  text-align: center;
}
.circle-mini:hover {
  cursor: pointer;
}

.circle-mini-0 {
  top: 147px;
  left: 325px;
}
.circle-mini-1 {
  top: 195px;
  left: 433px;
}
.circle-mini-2 {
  top: 285px;
  left: 468px;
}
.circle-mini-3 {
  top: 394px;
  left: 423px;
}
.circle-mini-4 {
  top: 431px;
  left: 306px;
}
.circle-mini-5 {
  top: 347px;
  left: 195px;
}
.circle-mini-6 {
  top: 220px;
  left: 202px;
}

/* END: MINI CIRCLES */



/* SET: CIRCULOS CONCENTRICOS */
.circle-out {
  width: 285px;
  height: 285px;
  border-radius: 50%;
  background: white;
  border: solid 1px #CCC;

  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
          align-items: center;
}
.circle-in {
  width: 245px;
  height: 245px;
  border-radius: 50%;
  padding-left: 15px;
  padding-right: 15px;


  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
          align-items: center;
}
.circle-in p {
  font-size: 0.85em;
}
.circle-in p span {
  font-size: 1.7em;
}
.wrapper-main-content-pieces #tab1 section.wrapper-infografia .bg-logo-wheel-wke {
  background-image: url('../img/logo-wheel-wolters-kluwer.png');
  background-repeat: no-repeat;
  background-position: top left;
  width: 246px !important;
}
/* END: CIRCULOS CONCENTRICOS */


/* SET: OPTION BOXES */
.box {
  position: absolute;
  width: 160px;
}

.wrapper-main-content-pieces #tab1 section.wrapper-infografia .box .box-flex-left {
  width: 135px !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
          align-items: flex-start;
}
.box-flex-left .box-title {
  padding-left: 2px;
}
.box-flex-left .box-title span {
  display: block;
}
.box-flex-left .box-icons .fa {
  margin-left: 0;
  margin-right: 3px;
}
.wrapper-main-content-pieces #tab1 section.wrapper-infografia .box .box-flex-right {
  width: 100px !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
          align-items: flex-end;
}
.box-flex-right .box-title {
  padding-right: 2px;
}
.box-flex-right .box-icons .fa {
  margin-right: 0;
  margin-left: 3px;
  color: #ccc !important;
}



.box-title {
  font-size: 1.1em !important;
  line-height: 0.8em;
  text-align: left;
}
.box-title:hover {
  cursor: pointer;
}
.sub-txt {
  font-size: 0.7em !important;
}
.wrapper-main-content-pieces #tab1 section.wrapper-infografia .box .box-icons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 96px !important;
  font-size: 23px;
}
.wrapper-main-content-pieces #tab1 section.wrapper-infografia .box .box-icons a {
  color: #CCC;
}

/*** BOX WKE ***/

.box-0 {
  width: 110px;
  top: 40px;
  left: 335px;
  background-image: url('../img/bg-line-0.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-left: 9px;
  padding-top: 11px;
}


/*** BOX LEGAL ***/
.box-1 {
  top: 137px;
  left: 442px;
  background-image: url('../img/bg-line-1.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-left: 52px;
  padding-top: 5px;
}

/*** BOX ADMIN ***/
.box-2 {
  top: 255px;
  left: 490px;
  background-image: url('../img/bg-line-2.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-top: 6px;
  padding-left: 10px;
}


/*** BOX ASESORES ***/
.box-3 {
  top: 411px;
  left: 441px;
  background-image: url('../img/bg-line-3.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-top: 26px;
  padding-left: 60px;
}


/*** BOX PYMES ***/
.box-4 {
  top: 450px;
  left: 214px;
  background-image: url('../img/bg-line-4.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-top: 40px;
  padding-right: 64px;
}


/*** BOX RRHH ***/
.box-5 {
  top: 363px;
  left: 60px;
  background-image: url('../img/bg-line-5.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-top: 8px;
  padding-right: 64px;
}


/*** BOX EDUCACION ***/
.box-6 {
  top: 171px;
  left: 68px;
  background-image: url('../img/bg-line-6.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-top: 5px;
  width: 135px;
}
.box-6 .box-flex-right {
  /*padding-right: 23px;*/
  width: 128px;;
}

/* END: OPTION BOXES */




/* SET: BOTTOM TEXT BOX */
.wrapper-text-box-rrss {
  width: 95%;
}
.text-box-rrss {
  margin-top: -20px;
  margin-bottom: 20px;
  padding: 10px;
  background: #f2f2f2;
  border-radius: 12px;
}
.wrapper-main-content-pieces #tab1 .wrapper-text-box-rrss article.text-box-rrss > div {
  width: 100% !important;
}
.wrapper-main-content-pieces #tab1 .wrapper-text-box-rrss article.text-box-rrss .flex-comunity-benefits > div {
  width: 100% !important;
}

.text-box-rrss h4 {
  margin-bottom: 20px;
}
.flex-comunity-benefits {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.fa-chevron-right {
  font-size: 1em;
  font-weight: bold;
  margin-left: 0;
  margin-right: 7px;
  color: #669933;
}
/* END: BOTTOM TEXT BOX */








/**********************************************/
/*** INFOGRAFÍA VERTICAL **********************/
/**********************************************/

.wrapper-infografia-vertical {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: 50px;
  padding: 0;
}

.wrapper-main-content-pieces #tab1 section.wrapper-infografia-vertical div {
  width: 100% !important;
}
.wrapper-main-content-pieces #tab1 section.wrapper-infografia-vertical .item-vertical .circle-and-line .vertical-circle-mini {
  width: 35px !important;
}
.item-vertical, .item-vertical div.desc {
  text-align: left;
  /*border-top: solid 1px #F2F2F2;*/
  margin-bottom: 30px;
}


.item-vertical .circle-and-line {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.circle-and-line .vertical-circle-mini {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  color: white;
  font-size: 1.5em;
  margin-right: 5px;

  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
          align-content: center;
}
.circle-and-line hr {
  width: 98%;
  margin-top: 15px;
  border-top: solid 1px #CCC;
}




.item-vertical .title {
  font-size: 2em;
}
.item-vertical .subtitle {
  font-size: 1.1em;
}

.item-vertical .icons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  font-size: 1.8em;
}
.item-vertical .icons a {
  color: #CCC;
}
.item-vertical .icons i.fa {
  margin-left: 0;
  margin-right: 8px;
}
.item-vertical .desc {
  font-size: 1.4em;
  margin-top: 8px;
}












/****************************************/
/*** MEDIA QUERIES **********************/
/****************************************/
@media all and (min-width: 700px) {
  .wrapper-infografia-vertical {
    display: none;
  }
}
@media all and (max-width: 700px) {
  .wrapper-infografia {
    display: none;
  }
  .flex-comunity-benefits {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 1.2em;
  }
  .item-vertical .subtitle {
    font-size: 1.6em;
  }
  .fa {
    margin-left: 0;
    margin-right: 7px;
  }
}
@media all and (max-width: 414px) {
  .wrapper-text-box-rrss {
    width: 92%;
  }
}