* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
.container {
  width: 100%;
  overflow: hidden;
}
.container .section {
  width: 100%;
  height: 700px;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
}
.container .box-section1,
.container .box-section2,
.container .box-section5,
.container .box-section6,
.container .box-section7,
.container .box-section8,
.container .box-section9,
.container .box-section11 {
  height: auto;
}
.container .section .box-content .sld {
  margin: auto 0;
  position: relative;
}
.container .section .box-content {
  width: 50%;
}

/* -------------------------------- Color de fondo de los contenedores -------------------------------- */

.container .box-section1 {
  background-color: #cce2dc;
}
.container .box-section2 {
  background-color: #feb01d;
}
.container .box-section3 {
  background-color: #ffffff;
}
.container .box-section4 {
  background-color: #cbd211;
}
.container .box-section5 {
  background-color: #cce2dc;
}
.container .box-section6 {
  background-color: #ffb01c;
}
.container .box-section7 {
  background-color: #003057;
}
.container .box-section8 {
  background-color: #ffb01c;
}
.container .box-section9 {
  background-color: #cce2dc;
}
.container .box-section10 {
  background-color: #d1d832;
}

/* -------------------------------- Contenedores con texto -------------------------------- */

.container .section .box-text {
  padding: 80px;
  line-height: 24px;
  position: relative;
  overflow: auto;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
}
.container .section .box-text2 {
  padding: 80px;
  line-height: 24px;
  position: relative;
  overflow: auto;
}

/* -------------------------------- Contenedores con img. de fondo -------------------------------- */

.container .box-section1 .content1 {
  background-image: url("../imgs/imagen_01.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.container .box-section3 .content2 {
  background-image: url("../imgs/imagen_02.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.container .box-section4 .content1 {
  background-image: url("../imgs/imagen_03.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.container .box-section5 .content2 {
  background-image: url("../imgs/imagen_04.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.container .box-section6 .content1 {
  background-image: url("../imgs/imagen_05.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center right;
}
.container .box-section7 .content2 {
  background-image: url("../imgs/imagen_06.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.container .box-section10 .content2 {
  background-image: url("../imgs/imagen_07.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

/* -------------------------------- Títulos -------------------------------- */

.container .section .box-content .title {
  color: #0687a7;
  font-size: 50px;
  font-family: "OpenSans-Regular";
  line-height: 50px;
}
.container .section .box-content .title1 {
  color: #fff;
  font-size: 2em;
  font-family: "PlayfairDisplay-Regular";
}
.container .section .box-content .title2 {
  color: #d2d836;
  font-size: 34px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title3 {
  color: #003057;
  font-size: 32px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title4 {
  color: #fff;
  font-size: 32px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title5 {
  color: #003057;
  font-size: 50px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 58px;
}
.container .section .box-content .title6 {
  color: #fff;
  font-size: 34px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title7 {
  color: #003057;
  font-size: 45px;
  font-family: "OpenSans-Bold";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title8 {
  color: #d2e8e2;
  font-size: 27px;
  font-family: "OpenSans-Bold";
  line-height: 27px; /* 38px;*/
}
.container .section .box-content .title9 {
  color: #003057;
  font-size: 27px;
  font-family: "OpenSans-Bold";
  line-height: 27px; /* 38px;*/
}
.container .section .box-content .title10 {
  color: #003057;
  font-size: 32px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title11 {
  color: #fff;
  font-size: 20px;
  font-family: "OpenSans-Bold";
  line-height: 20px; /* 38px;*/
}
.container .section .box-content .title12 {
  color: #003057;
  font-size: 20px;
  font-family: "OpenSans-Bold";
  line-height: 20px; /* 38px;*/
}
.container .section .box-content .title13 {
  color: #fff;
  font-size: 50px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 58px;
}
.container .section .box-content .title14 {
  color: #003057;
  font-size: 25px;
  font-family: "PlayfairDisplay-Regular";
  line-height: 46px; /* 38px;*/
}
.container .section .box-content .title15 {
  color: #003057;
  font-size: 27px;
  font-family: "OpenSans-Bold";
  line-height: 27px; /* 38px;*/
}

/* -------------------------------- Iconos de los títulos -------------------------------- */

.container .section .box-content .title-img {
  position: relative;
}
.container .section .box-content .title-img .icon-left {
  position: absolute;
  top: -5px;
  left: -65px;
  width: 55px;
}

/* -------------------------------- Iconos de los títulos - audios -------------------------------- */

.container .section .box-content .title-img .btn-play {
  position: absolute;
  left: -65px;
  top: 80px;
  cursor: pointer;
}
/* -------------------------------- Plecas de los títulos -------------------------------- */

.container .section .box-content .pleca {
  position: absolute;
  height: 42px;
  top: 4px;
  left: 0;
}
.container .section .box-content .width-pleca1 {
  width: 200px;
}
/* .container .section .box-content .width-pleca2 {  } */ /* En caso de que se ocupe */

/* -------------------------------- Texto y color del texto de las plecas -------------------------------- */

.container .section .box-content .title-img .text-pleca {
  margin-left: 25px;
}
.container .section .box-content .title-img .text-pleca-color1 {
  color: #1c3355;
}
.container .section .box-content .title-img .text-pleca-color2 {
  color: #ffffff;
}
.container .section .box-content .title-img .text-pleca-color3 {
  color: #d2d836;
}

/* -------------------------------- Iconos de los flechas -------------------------------- */

.container .section .arrow {
  position: absolute;
  cursor: pointer;
}
.container .section .arrow-left {
  top: 60%;
  left: 3%;
  transform: translate(-3%, -60%);
  display: none;
}
.container .section .arrow-right {
  top: 60%;
  right: 3%;
  transform: translate(-3%, -60%);
}

.container .section .arrow-left2 {
  top: 75%;
  left: 3%;
  transform: translate(-3%, -75%);
  display: none;
}
.container .section .arrow-right2 {
  top: 75%;
  right: 3%;
  transform: translate(-3%, -75%);
}

/* -------------------------------- Textos -------------------------------- */

.container .section .box-content .text1 {
  font-family: "OpenSans-Light";
  font-size: 20px;
  color: #fff;
}
.container .section .box-content .text2 {
  font-family: "OpenSans-Light";
  font-size: 20px;
  color: #003057;
}
.container .section .box-content .text3 {
  font-family: "OpenSans-Light";
  font-size: 20px;
  color: #000;
}

.container .section .box-content .text4 {
  font-family: "OpenSans-Regular";
  font-size: 20px;
  color: #000;
}

.container .section .box-content .text5 {
  font-family: "OpenSans-Regular";
  font-size: 20px;
  color: #095388;
}

.container .section .box-content .text6 {
  font-family: "OpenSans-Regular";
  font-size: 20px;
  color: #1c3355;
}

/* -------------------------------- Texto Resaltados -------------------------------- */

.container .section .box-content .highlighted1 {
  font-family: "OpenSans-SemiBold";
  color: #ffffff;
}
.container .section .box-content .highlighted2 {
  font-family: "OpenSans-SemiBold";
  color: #000000;
}
.container .section .box-content .highlighted3 {
  font-family: "OpenSans-SemiBold";
  color: #d2d836;
}
.container .section .box-content .highlighted4 {
  font-family: "OpenSans-SemiBold";
  color: #003057;
}
.highlightedos {
  font-family: "OpenSans-SemiBold";
}

/* -------------------------------- Cursiva -------------------------------- */

.container .section .box-content .cursive {
  font-family: "OpenSans-BoldItalic";
}
.container .section .box-content .cursive2 {
  font-family: "OpenSans-Italic";
}
.container .section .box-content .underline {
  text-decoration: underline;
}

/* -------------------------------- Esquemas -------------------------------- */

.container .section .img-scheme {
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  margin: auto auto;
}

/* -------------------------------- Ejerciccios -------------------------------- */

.container .section .box-content .content-boxes {
  width: 100%;
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
}
.container .section .box-content .content-boxes .box1 {
  padding: 20px;
  background-color: #d2d936;
  border-radius: 5px;
  width: 45%;
}
.container .section .box-content .content-boxes .box2 {
  padding: 20px;
  background-color: #65afa4;
  border-radius: 5px;
  width: 45%;
}

.container .section .box-content .content-boxes2 {
  width: 100%;
  margin-top: 30px;
  display: flex;
  justify-content: space-around;
}
.container .section .box-content .content-boxes2 .button {
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
}
.container .section .box-content .content-boxes2 .button-good {
  background-color: #d2d836;
  pointer-events: none;
}
.container .section .box-content .content-boxes2 .button-bad {
  background-color: #dcb443;
  pointer-events: none;
}

.container .section .box-content .box-act {
  width: 100%;
}
.container .section .box-content .box-act .cover {
  width: 100%;
  cursor: pointer;
}

.container .section .box-content .box-feedback {
  padding: 30px;
  position: absolute;
  text-align: justify;
  border-radius: 5px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
}

.container .section .box-content .feedback-ej0 {
  background-color: #d1e3dc;
}
.container .section .box-content .feedback-ej1 {
  background-color: #ffb01c;
  display: block;
  height: min-content;
  max-height: 80%;
  overflow: auto;
}
.container .section .box-content .feedback-ej2 {
  background-color: #ffb81c;
}
.container .section .box-content .feedback-ej6 {
  background-color: #cbd211;
}
.container .section .box-content .feedback-ej7 {
  background-color: #fff;
}

.container .section .box-content .feedback-ej3 {
  background-color: #e02a6c;
  max-height: 400px;
  padding: 5em !important;
  overflow: auto;
}
.container .section .box-content .feedback-ej4 {
  background-color: #9e007e;
  max-height: 400px;
  overflow: auto;
}

.container .section .box-content .feedback-ej5 {
  background-color: #cbd211;
  max-height: min-content;
  padding: 5em !important;
  overflow: auto;
}

/* -------------------------------- Estilos especiales -------------------------------- */

.container .box-section2 .special {
  width: 100%;
}
.container .box-section3 .content1 {
  background-color: #003057;
}
.container .box-section3 .content2 {
  position: relative;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
}
.container .box-section3 .content2 .p-special {
  position: absolute;
  left: 80px;
  top: 80px;
}
/*.container .box-section4 .special { background-color: #1c3355; }*/
.container .box-section5 .special {
  background-color: #ffffff;
}
.container .box-section6 .content2 .slide ul {
  padding-left: 5px;
}
.container .box-section7 .special {
  background-color: #d2d836;
}
.container .box-section7 .content2 img {
  width: 450px;
}
.container .box-section8 .content1 {
  width: 100%;
}
/*.container .box-section8 .special img { width: 250px; }*/
/*.container .box-section8 .content1 .p-special {
	position: absolute;
	left: 5%;
}*/
.container .box-section9 .content1 {
  width: 100%;
}
.container .box-section1 .special .special-title1 {
  margin-top: 0;
}
.container .box-section1 .special .special-title2 {
  margin-bottom: 0;
  font-size: 30px;
  font-family: "PlayfairDisplay-Regular";
}
.container .box-section1 .special .special-title3 {
  margin-top: 0;
  bottom: 0;
}
.container .box-section1 .special .special-title4 {
  margin-top: 0;
  bottom: 0;
  margin-left: 45px;
}
.container .section .box-content .close {
  width: 20px;
  position: absolute;
  top: 5px;
  right: 5px;
  cursor: pointer;
}
#closeRetro10,
#closeRetro11,
#closeRetro12 {
  display: none;
}

.container .section .box-content .hidden {
  display: none;
}
.container .section .box-content .colorfbl {
  display: none;
  background-color: #fff;
  margin: -5em;
  padding: 5em;
}
.container .section .box-content .colorfan {
  display: none;
  background-color: #ffb01c;
  margin: -5em;
  padding: 5em;
}

.container .section .box-content .no-margin-top {
  margin-top: 0px;
}
.container .section .box-content .no-margin-bottom {
  margin-bottom: 0px;
}
.container .section .box-content .special-ul {
  color: #d2d836;
  padding-left: 30px;
}
.container .section .box-content .special-ul .special-li {
  color: #ffffff;
}
.container .section .box-content-flex {
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
}
.container .section .box-content .margin-auto {
  margin: auto auto;
}

.container .section .box-content .container-note {
  text-align: center;
}
.container .section .box-content .note-box {
  padding: 20px;
  background-color: #103054;
  border-radius: 10px;
  width: 70%;
  display: inline-block;
  text-align: left;
  margin-top: 50px;
}
.container .section .box-content .note-box2 {
  padding: 20px;
  background-color: #1c3355;
  border-radius: 10px;
  width: 70%;
  display: inline-block;
  text-align: left;
}

/* -------------------------------- Estilos especiales -------------------------------- */

.container .box-footer {
  padding: 30px;
  background-color: #007fa3;
  font-family: "PlayfairDisplay-Regular";
  color: #fff;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -ms-justify-content: flex-end;
  -o-justify-content: flex-end;
  justify-content: flex-end;
}

/*Generales*/
.margin_l_t_p {
  margin-left: 50px;
}

.margin_l {
  margin-left: 25px;
}
.subti_margin_t {
  margin-top: -1em;
}

/*LISTAS*/
.margin_ul {
  margin-left: -1em !important;
}
.color_b {
  color: #e71b7e;
}
.text_li_az {
  color: #ffb01c;
}

/*Ícono y Título Parte2*/
.margin_t_icon {
  margin-top: 20%;
}
.margin_tit_prep {
  text-align: center;
  margin-top: -5px;
}
.margin_tit_lid {
  margin-left: 37%;
  margin-top: 3px;
}
.margin_tit_dar {
  margin-left: 18%;
  margin-top: 3px;
}

/*Texto y Botón "Sección" 8*/
.text_alin_c {
  text-align: center;
}
.content_btn {
  width: 380px;
  height: 40px;
  background-color: #d1d832;
  border-radius: 13px;
  /*margin-top: 20px;
	margin-left: 37%;*/
}
.text_btn {
  text-align: center;
  padding-top: 8px;
}

/* "Sección" 9*/
.contenedor_icon_s9 {
  width: 100%;
  height: auto;
  display: flex;
  /*flex-direction: row;
	flex-wrap: wrap;*/
  justify-content: space-around;
}
.cont_img_icon_s9 {
  width: 20%;
  height: auto;
}
.img_icon_s9 {
  width: 100%;
  height: auto;
  /*margin: 20px;*/
}

.fond_bl_esp_sli {
  background-color: #fff;
  /*width: calc(100% + 10em);*/
  padding: 5em;
  margin-top: -5em;
  margin-left: -5em;
  margin-right: -5em;
  margin-bottom: -5em;
}

/* _______________________________ S8 _______________________________ */
.part_il {
  width: 20%;
  height: auto;
  margin: auto 1%;
  display: inline-flex;
  align-self: center;
}
.part_il_il {
  width: 50%;
  height: auto;
}
.part_ta {
  width: 73%;
  height: auto;
  display: inline-block;
  align-self: center;
}

.tam2col {
  border: 1px solid #122442;
  width: 45%;
  height: auto;
  margin: 0.3em 0.5em;
  padding: 1em;
  display: inline-block;
}
.colorT1 {
  background-color: #003057;
  border: 1px solid transparent !important;
}
.colorT2 {
  background-color: #0687a7;
  border: 1px solid transparent !important;
}
.colorT3 {
  background-color: #c8d437;
  border: 1px solid transparent !important;
}
.TexTi1 p {
  font-family: "OpenSans-SemiBold";
  font-size: 1.3em;
  text-align: center;
  color: #fff;
  margin: 0.5em auto;
}
.TexTi2 p {
  font-family: "OpenSans-SemiBold";
  font-size: 1.3em;
  text-align: center;
  color: #fff;
  margin: 0.5em auto;
}
.tam2col_num {
  width: 15%;
  height: auto;
  font-family: "PlayfairDisplay-Bold";
  text-align: center;
  color: #003057;
  font-size: 3em;
  display: inline-block;
}
.tam2col_text {
  font-family: "OpenSans-SemiBold";
  width: 80%;
  text-align: justify;
  color: #122442;
  font-size: 1em;
  display: inline-block;
}
.tam1col_text {
  font-family: "OpenSans-SemiBold";
  width: 100%;
  text-align: justify;
  color: #122442;
  font-size: 1em;
  display: inline-block;
}

.tab_gen {
  width: 100%;
}
.tab_gen tr td {
  width: 50%;
  border-collapse: collapse;
}
.tab_cont {
  border: 1px solid #122442;
}
/* _______________________________ S8 _______________________________ */

/* _______________________________ S9 _______________________________ */
.cont_s9 {
  position: relative;
  /*height: 30em;*/
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin: 60px 0;
}
.conv_iz {
  /*background-image: url('../imgs/img_s9_1.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	height: 30em;*/
  width: 350px;
  position: relative;
}
.conv_iz2 {
  /*background-image: url('../imgs/img_s9_2.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	height: 30em;*/
  width: 350px;
  position: relative;
}
.conv_iz3 {
  /*background-image: url('../imgs/img_s9_3.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	height: 30em;*/
  width: 350px;
  position: relative;
}
.conv_resp_d {
  /*width: 400px;*/
}

.audio_s9 {
  width: 70px;
  /*height: auto;*/
  position: absolute;
  cursor: pointer;
}
.audio_s9 img {
  width: 100%;
  /*height: auto;
	position: absolute;*/
}
.respuestas_s9 {
  /*background-color: #D1E3DC;*/
  font-family: "OpenSans-Regular";
  font-size: 0.8em;
  border: #003057 solid 1px;
  border-radius: 10px;
  text-align: center;
  /*margin: 1em auto;*/
  color: #003057;
  width: 70%;
  margin-bottom: 10px;
  cursor: pointer;
}
.ara_resp_s9_1 {
  width: 150px;
  background-color: #cbd211;
  border-radius: 10px;
  position: absolute;
  font-family: "OpenSans-Regular";
  font-size: 14px;
  padding: 10px;
  line-height: 16px;
  text-align: center;
  color: #003057;
}
.ara_resp_s9_1 p {
  font-family: "OpenSans-Regular";
  font-size: 0.8em;
  padding: 0 auto;
  margin: 0 auto;
  text-align: center;
  color: #fff;
}
.ara_resp_s9_2 {
  width: 150px;
  background-color: #cbd211;
  border-radius: 10px;
  position: absolute;
  font-family: "OpenSans-Regular";
  font-size: 14px;
  padding: 10px;
  line-height: 16px;
  text-align: center;
  color: #003057;
}
.ara_resp_s9_2 p {
  font-family: "OpenSans-Regular";
  font-size: 0.8em;
  padding: 0 auto;
  margin: 0 auto;
  text-align: center;
  color: #fff;
}
.ara_resp_s9_3 {
  width: 180px;
  background-color: #c8d437;
  border-radius: 10px;
  position: absolute;
  font-family: "OpenSans-Regular";
  font-size: 0.8em;
  padding: 10px;
  line-height: 16px;
  text-align: center;
  color: #122442;
}
.ara_resp_s9_3 p {
  font-family: "OpenSans-Regular";
  font-size: 0.8em;
  padding: 0 auto;
  margin: 0 auto;
  text-align: center;
  color: #fff;
}

/* _______________________________ S9 _______________________________ */

.my-r {
  position: absolute;
  top: 25%;
  left: 50%;
  padding: 20px;
  background-color: #cce2dc;
  border-radius: 10px;
  color: #003057;
  font-family: "OpenSans-Light";
}
.container .box-footer .text1 {
  font-family: "PlayfairDisplay-Regular";
  font-size: 12px;
  text-align: left;
}