*{
	font-family: Open Sans, Sans serif;
	scroll-behavior: smooth;
}

/* HEADER */

header{
	background-color: #282828;
	width: 100%;
	height: 135px;
	position: fixed;
	z-index: 100;
	transition: all 0 ease;
}

.header__claro{
	box-shadow: 0 7px 50px -8px #000;
}


#flex__container__header{
	max-width: 1100px;
	height: 130px;
	margin: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.flex__item__header{
	height: 95px;
}

.flex__item__header img{
	width: 220px;
}

.flex__item__header:first-child{
	max-width: 221px;
	min-width: 220px;
}
.flex__item__header:nth-child(2){
	flex-grow: 1;

}
.flex__item__header:nth-child(3){
	min-width: 600px;
}
.flex__item__header:nth-child(4) {
	display: none;
}
#flex__nav__ul{
	display: flex;
	height: 95px;
	align-items: center;
	justify-content: space-evenly;
	padding-left: 0;
}
.flex__nav__li{
	list-style-type: none;
}
.flex__nav__li a{ 
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	color: #79e4e1;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 16px 0;
	position: relative;
	transition: all .3s ease;
}
.nav__oscuro{
	color: #333;
}

.flex__nav__li a:hover{ 
	color: #f78222;
	cursor: pointer;

}
.flex__nav__li a::before{ 
	content: "";
	display: block;
	width: 100%;
	height: 2px;
	background: #f78222;
	position: absolute;
	bottom: 0;
	opacity: 0;
	transition: all .3s ease;
}	
.flex__nav__li a:hover::before{
	opacity: 100%;
}
.naranja a{
	color: #f78222;
}
.naranja a::before{ 
	opacity: 100%;
}	

#flex__container__separador{
	width: 100%;
	display: flex;
}
.flex__item__separador{
	height: 5px;
}
.flex__item__separador:first-child{
	background-color: #cacaca;
	width: 10%;
}
.flex__item__separador:nth-child(2){
	background-color: #666;
	width: 10%;
}
.flex__item__separador:nth-child(3){
	background-color: #333;
	width: 10%;
}
.flex__item__separador:nth-child(4){
	background-color: #f78222;
	width: 28%;
}
.flex__item__separador:nth-child(6){
	background-color: #79e4e1;
	width: 28%;
}
.flex__item__separador:nth-child(5){
	background-color: #3bc4ba;
	width: 14%;
}

.espacio__vacio{
	height: 135px;
	width: 100%;
	background: transparent;
}

/* CAROUSEL */

.carousel-indicators .active {
	background-color: #79e4e1;
}
.carousel-indicators [data-bs-target] {
	height: 10px;
	width: 10px;
	border-radius: 50%;
}

.carousel-pc{
	display: block;
}
.carousel-responsivo{
	display: none;
}



/* PRESENTACION */

.flex__container__presentacion{
	max-width: 1100px;
	margin: auto;
	display: flex;
	padding: 100px 50px;
	border-bottom: 1px solid #ddd;
}
.flex__item__presentacion{
	color: #333;
	font-size: 18px;
	text-align: justify;
	font-weight: normal;
}
.flex__item__presentacion p{
	margin-bottom: 0px;
}

/* TEMAS */

.flex__container__tema{
	display: flex;
	padding:  110px 0 110px 3px;
	max-width: 1100px;
	margin: auto;
	align-items: center;
	min-height: 100px;
	border-bottom: 1px solid #ddd;
}
.flex__item__tema:first-child{
	min-width: 310px;
	max-width: 310px;
}

	/* INDICE */	

.flex__content__indice{
	display: flex;
	justify-content: flex-start;
	height: 250px;
	align-items: center;
}
.content__indice__altura{
	height: 150px;
}

.flex__content__indice div{
	text-align: right;
	max-width: 255px;
	min-width: 255px;
}
.flex__content__indice h3{
	font-size: 34px;
	font-weight: 700;
	color: #333;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 18px;
}
.flex__content__indice ul{
	padding-left: 0;
	margin-bottom: 0;
}
.flex__content__indice li{
	list-style-type: none;
	margin-bottom: 10px;
}
.flex__content__indice a{
	text-decoration: none;
	font-size: 20px;
	color: #f78222;
	font-weight: 500;
	text-transform: initial;
	transition: all .3s ease;
}
.flex__content__indice a:hover{
	color: #79e4e1;
	cursor: pointer;
}
.flex__container__linea{
	display: flex;
	margin-top: 28px;
}
.flex__item__linea:first-child{
	height: 5px;
	width: 50px;
	min-width: 50px;
	flex-grow: 1;
}
.flex__item__linea:nth-child(2){
	height: 5px;
	width: 50px;
	min-width: 50px;
	background-color: #333;
}

    /* PARRAFO */

.flex__content__texto h3{
	color: #666;
	font-size: 20px;
	margin-bottom: 16px;
	font-weight: bold;
	text-transform: initial;
}
.flex__content__texto h4{
	color: #666;
	font-size: 18px;
	margin-bottom: 10px;
	font-weight: 500;
}
.flex__content__texto ul{
	padding-left: 21px;
	margin-bottom: 0;
}
.flex__content__texto li{
	text-align: justify;
	color: #666;
	font-size: 18px;
}
.content__texto__indice ul{
	padding-left: 0;
}
.content__texto__indice li{
	list-style-type: none;
}
.flex__content__texto p{
	text-transform: uppercase;
	font-size: 14px;
	text-align: right;
	margin-bottom: 0px;
	margin-top: 12px;
}
.flex__content__texto p i{
	margin-right: 10px;
	font-size: 14px;
}
.flex__content__texto a{
	color:#888;
	text-decoration: none;
}
.flex__content__texto a:hover{
	color:#666;
	text-decoration: none;
}
#listado__interior{
	padding-left: 43px;
	list-style-type: circle;
}

/* INTERIORES */

.flex__container__tema__interior{
	max-width: 1100px;
	margin: auto;
	display: flex;
	flex-wrap: nowrap;
	min-height: 100px;
	padding-top: 135px;
}
.flex__item__tema__interior:first-child{
	min-width: 300px;
	max-width: 300px;
}
.flex__item__tema__interior:nth-child(2){
	flex-grow: 1;
	min-width: 300px;
}
.tema__interior__interno__indice{
	padding: 0 0 18vh 0; 
}
.menu__interior{
	position: sticky;
	top: 42vh;
}
.menu__interior h3{
	color: #cacaca;
	font-weight: lighter;
	font-size: 35px;
}
.menu__interior p{
	color: #cacaca;
	text-transform: initial;
	font-size: 20px;
	font-weight: 500;
}
.menu__interior p:hover{
	color: #666;
	cursor: pointer;
}

.menu__interior .flex__item__linea:nth-child(2){
	background-color: #cacaca;
	height: 2px;
}
.content__interior{
	border-bottom: 1px solid #ddd;
}
.content__interior div{
	padding: 20vh 0 20vh 0;
}
.content__interior h3{
	color: #f78222;
	font-size: 20px;
	text-transform: initial;
}

.content__interior .texto__tema__font{
	text-align: justify;
	color: #666;
	text-transform: initial;
	font-size: 18px;
}
.content__interior .texto__margin{
	margin-bottom: 28px;
}

/* CONTACTO */

#section__formulario{
	padding: 220px 0 35px 0;
	max-width: 1100px;
	margin: auto;
}

.flex__container__formintro{
	color:  #333;
}

.flex__container__contacto{
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}
.flex__content__formcontacto{
	max-width: 700px;
	display: flex;
	flex-direction: column;
	margin: auto;
	justify-items: center;
}
.content__infocontacto{
	min-width: 430px;
	max-width: 430px;
	max-height: 300px;
	min-height: 300px;
	margin: auto;
	align-items: center;
	background-color: #f78222;
	padding: 42px 60px 36px 55px;
	color: #fff;
}
.flex__contacto{
	display: flex;
	height: 50px;
	align-items: center;
}
.content__infocontacto li{
	min-width: 100px;
	list-style-type: none;
	position: relative;
	min-height: 30px;
	margin: 0 0 0 0;
}

.content__infocontacto li:first-child h3{
	font-weight: 700;
	font-size: 34px;
	line-height: 1.5;
}

.content__infocontacto li:first-child{
	margin-bottom: 10px;
}

.content__infocontacto p{
	display: inline-block;
}
.icon{
	margin-left: -7px;
	min-width: 40px;
	text-align: center;
	font-size: 30px;
	margin-block-start: 0;
    margin-block-end: 0;
    margin-right: 4px;
}

.texto{
	margin-block-start: 0;
    margin-block-end: 0;
    font-size: 28px;
    font-weight: 300;
}
.celu{
	margin-top: 3px;
}
.arroba{
	font-size: 27px;
	margin-top: 6px;
}

input{
	width: 620px;
	max-width: 620px;
	padding: 8px;
	margin: 25px 0;
}

textarea{
	width: 620px;
	max-width: 620px;
	min-height: 110px;
	max-height: 150px;
	padding: 8px;
	margin: 15px;
}
.form{
	margin-bottom: 25px;
	
}
.form:focus{
	border:1 px solid #f78222;
}
input[type="submit"]{
	border-radius: 3px;
	max-width: 150px;
	border: 3px solid #f78222;
	background-color: #fff;
	text-transform: uppercase;
	transition: all .3s ease;
	color: #f78222;
}


input[type="submit"]:hover{
	background-color: #f78222;
	color: #fff;
}
.flex__envio{
	display: flex;
}
.confirmacion__envío{
	color: green;
	font-size: 16px;
	margin-left: 25px;
	text-transform: uppercase;
	font-weight: 400;
}
.completar__reenvio{
	color: red;
	font-size: 16px;
	margin-left: 25px;
	text-transform: uppercase;
	font-weight: 400;
}

.flex__item__info-y-mapa:first-child{
	display: none;
}

.flex__container__mapa-y-texto{
	display: flex;
	max-width: 1100px;
	margin-top: 50px;
}
.flex__item__mapa-y-texto{
	height: 300px;
}
.flex__item__mapa-y-texto:first-child{
	max-width: 400px;
	min-width: 400px;
	background-color: #3bc4ba;
	color: #fff;
	text-align: left;
	font-size: 30px;
	font-weight: 500;
	padding: 23px 10px 55px 55px;

}
.flex__item__mapa-y-texto:first-child b{
	font-size: 34px;
	line-height: 1.5;
}
.flex__item__mapa-y-texto:first-child i{
	font-size: 30px;
	margin-right: 12px;
}
.flex__item__mapa-y-texto:first-child p{
	font-weight: 300;
	font-size: 28px;
	line-height: 1.5;
	margin-top: 15px;
}

.flex__item__mapa-y-texto:nth-child(2){
	width: 700px;
}
#mapa-tablet{
	display: none;
}
#mapa-full-screen{
	display: block;
}

/* FOOTER */

footer{
	width: 100%;
	background-color: #333;
}

.flex__container__footer{
	display: flex;
	max-width: 1100px;
	margin: auto;
	justify-content: space-between;
	padding: 60px 0 10px 0;
}

.flex__item__footer{
	width: 180px;
	min-width: 150px;
	height: 250px;
	color: white;
}
.flex__item__footer:nth-child(5){
	min-width: 260px;
}
.flex__content__footer h6{
	text-transform: uppercase;
	font-size: 12px;
}
.flex__content__footer ul{
	list-style-type: none;
	padding-left: 0;
}
.flex__content__footer li{

}
.flex__content__footer a{
	text-decoration: none;
	color: white;
	font-size: 12px;
	height: 5px;

}

.flex__content__footer a:hover{
	color: #eee;

}
.flex__content__footer p{
	display: inline-block;
}
.flex__item__footer:nth-child(5) p{
	font-size: 16px;
	font-weight: 500;
}
.flex__item__footer:nth-child(5) i{
	margin-right: 12px;
	font-size: 20px;
	text-align: center;
	width: 24px;
	margin-top: 3px;
}

.lineheight-corto{
	max-height: 1px;
}

.contacto__iconos{
	display: flex;
} 
.flex__container__copyright{
	color: white;
	display: flex;
	max-width: 1100px;
	margin: auto;
	justify-content: flex-start;
	font-size: 12px;
}

	/* BOTON NAVEGACION */

.boton__navegacion{
	position: fixed;
	z-index: 90;
	right: 10px;
	bottom: -4px;
	text-align: center;
	display: none;
}

.boton__navegacion a{
	opacity: .3;
	font-size: 50px;
	color: #f78222;
	transition: all .2s ease;
}

.boton__navegacion a:hover{
	opacity: 1;
	color: #f78222;
}


@media only screen and (max-width: 1200px){

	/* HEADER */

	#flex__container__header{
		max-width: 950px;
		height: 130px;
		margin: auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.flex__item__header:nth-child(3) {
	    min-width: 400px;
	    width: 560px;
	}
	#flex__nav__ul {
	    justify-content: space-around;
	}
	.flex__item__header:nth-child(4) {
	   display: none;
	}


	/* CAROUSEL */

	.carousel-responsivo{
		display: none;
	}
	.carousel-pc{
		display: block;
	}


	/* PRESENTACION */

	.flex__container__presentacion{
		max-width: 950px;
	}	

	/* TEMA */
	.flex__container__tema{
		max-width: 950px;
	}
	.flex__container__tema__interior{
		max-width: 950px;
	}

	
	/* CONTACTO */

	#section__formulario{
		max-width: 950px;
	}
	.content__infocontacto{
		min-width: 430px;
		max-width: 430px;
		max-height: 300px;
		min-height: 300px;
		margin: auto;
		align-items: center;
		background-color: #f78222;
		padding: 42px 60px 36px 55px;
		color: #fff;
	}

	input{
		width: 480px;
		max-width: 480px;
		padding: 8px;
		margin: 25px 0;
	}
	textarea{
		width: 480px;
		max-width: 480px;
	}
		
	.flex__item__info-y-mapa:first-child{
		display: none;
	}
	#mapa-fullscreen{
		display: none;
	}
	#mapa-tablet{
		display: block;
	}

	/* FOOTER */

	.flex__container__footer{
		max-width: 950px;
	}
	.flex__container__copyright{
		max-width: 950px;
	}
	.flex__item__footer:nth-child(5){
		min-width: 217px;
	}

	
}
@media only screen and (max-width: 1000px){

	/* HEADER */

	#flex__container__header{
		max-width: 750px;
		height: 130px;
		margin: auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.flex__item__header:nth-child(3) {
	    min-width: 400px;
	    width: 510px;
	}
	#flex__nav__ul {
	    justify-content: space-between;
	}
	.flex__item__header:nth-child(4) {
	   display: block;
	}
	.flex__item__header:nth-child(3) {
	   display: none;
	}

	
	.flex__container__reponsive-nav{
		display: flex;
		flex-direction: column;
		background-color: #fff;
		min-height: 100vh;
	    min-width: 100%;
	    position: absolute;
	    right: -100%;
	    top: 0;
	    z-index: 140;
	    transition: all .3s ease;

	}
	.flex__container__reponsive-nav{
		display: none;
	    right: 0;
	}
	.contenedor__responsive-boton{
		width: 30px;
		height: 30px;
		position: fixed;
		top: 57px;
		right:12vw;
		z-index: 150;
	}
	.responsive-nav-boton{
		width: 22px;
		height: 22px;
		position: absolute;
		top: 3px;
		right: 3px;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: row;
	}
	.border__boton-responsive{
		border: 1px solid #f78222;
	}
	.hamburguesa, .hamburguesa:after, .hamburguesa:before {
		height: 11%;
		width: 100%;
		background-color:#79e4e1;
		content: '';
		position: absolute;
		transition: all .2s ease;
		cursor: pointer;
	}
	.hamburguesa:hover, .hamburguesa:hover:after, .hamburguesa:hover:before{
		background-color:#f78222;
	}
	.boton-naranja{
		color: #f78222;
	}
	.hamburguesa:after{
		height: 100%;
		top: 7px
	}
	.hamburguesa:before{
		height: 100%;
		bottom: 7px
	}
	.cruz{
		background-color:#f78222;
		transition: all .2s;
		transform: rotateZ(45deg);
	}
	.cruz:before{
		background-color:#f78222;
		transition: all .2s;
		top: 0;
		transform: rotateZ(90deg);
		
	}
	.cruz:after{
		background-color:#f78222;
		transition: all .2s;
		top: 0;
		transform: rotateZ(0deg);

	}


	.flex__item__reponsive-nav:first-child{
		margin-bottom: 36px;
		border-bottom: 4px solid #f78222;
	}
	.flex__item__reponsive-nav div{
		max-width: 750px;
		margin: auto;
		margin-top: 23px;
		margin-bottom: 23px;
	}
	.nav__responsive__img img{
	    width: 220px;
	}
	.flex__item__reponsive-nav:nth-child(2){
		border-bottom: 4px solid #f78222;
		width: 100%;

	}
	#flex__nav__ul__responsive{
	    display: flex;
	    flex-direction: column;
	    margin-bottom: 0;
	    padding: 0;
	    width: 750px;
		margin: auto;
	}
	

	.flex__nav__li {
		margin-bottom: 36px;
	}
	.flex__nav__li a{
		font-size: 16px;
		color: #333;
	}
	

	/* CAROUSEL */

	.carousel-responsivo{
		display: block;
	}
	.carousel-pc{
		display: none;
	}
	
	.carousel-item img{
		object-fit: cover;
		height: 64vh;
	}
	.slide img {
		
	}	

	/* PRESENTACION */

	.flex__container__presentacion{
		max-width: 750px;
		padding: 100px 0;	
	}	


	/* TEMA */

	.flex__container__tema{
		max-width: 750px;
	}
	.flex__container__tema__interior{
		max-width: 750px;
	}
	.content__interior div{
		padding: 15vh 0;
	}
	/* CONTACTO */

	.flex__container__contacto{
		flex-direction: column-reverse;
	}
	#section__formulario{
		max-width: 750px;
	}
	.content__infocontacto{
		min-width: 100px;
		margin: auto;
		align-items: center;
		background-color: #f78222;
		padding: 36px 53px 36px 51px;
		color: white;
	}
	.flex__content__formcontacto{
		max-width: 750px;
	}
	input{
		max-width: 100%;
		width: 100%;
		padding: 8px;
		margin: 25px 0;
	}
	textarea{
		width: 100%;
		max-width: 100%;
	}
	.flex__container__info-y-mapa{
		margin-top: 50px;
	}
	.flex__item__info-y-mapa:first-child{
		display: block;
	}
	.flex__item__info-y-mapa:nth-child(2){
		min-width: 100%;
		margin-top: 0;
	}

	.flex__container__info-y-mapa{
		display: flex;
		flex-direction: column-reverse;
	}
	#mapa-phone{
		min-width: 300px;
		width: 100%;
	}
	.flex__container__mapa-y-texto{
		display: none;
	}
	.texto{
		margin-block-start: 0;
	    margin-block-end: 0;
	    font-size: 24px;
	    font-weight: 300;
	}

	/* FOOTER */

	.flex__container__footer{
		display: none;
	}

	footer{
		min-height: 60px;
	}
	.flex__container__copyright{
		max-width: 715px;
		padding: 10px 0 0 10px	;
	}
}
@media only screen and (max-width: 810px){	

	/* HEADER */

	.flex__item__header:first-child {
		margin-left: 16px;
	}
	.flex__item__reponsive-nav div {
		margin-left: 16px;
    	width: 90%;
	}	

	#flex__nav__ul__responsive{
		margin-left: 26px;
		width: 100%;
	}

	/* CAROUSEL */

	.carousel-responsivo{
		display: block;
	}
	.carousel-pc{
		display: none;
	}
	
	/* PRESENTACION */

	.flex__container__presentacion{
		max-width: 750px;
		padding: 80px 16px;	
	}	
	/* TEMA */

	.flex__container__tema{
		padding: 80px 16px;

	}
	.flex__container__tema__interior{
		padding: 135px 16px 0px 16px;
	}

	/* CONTACTO */
	.flex__container__formintro{
		max-width: 780px;
		margin: auto;
	}
	.flex__content__formcontacto{
		max-width: 780px;
	}

	#section__formulario {
	max-width: 100%;
    padding: 220px 0 0 0;
  	margin-bottom: -6px;
	}
	.flex__container__formintro{
		padding: 0 16px;
	}
	.flex__content__formcontacto{
		padding: 0 16px;
	}
}
@media only screen and (max-width: 730px){


	
	/* CAROUSEL */
	
	.carousel-responsivo{
		display: block;
	}
	.carousel-pc{
		display: none;
	}
	

	/* TEMA */

	.flex__container__tema{
		flex-wrap: wrap;
		justify-content: center;
		padding: 0 0 70px 0;
		margin: 0 16px;
	}
	.flex__content__indice{
		align-items: center;
		margin: 53px 0 26px 0;
	}
	.flex__container__tema__interior{
		flex-wrap: wrap;
		justify-content: center;
	}
	.tema__interior__interno__indice{
		padding: 0;
		
	}
	.flex__item__tema__interior:nth-child(2){
		border-top: 1px solid #777;
	}
	.flex__content__indice {
		justify-content: center;
	}
	.flex__content__indice div{
		text-align: center;
	}
	.flex__container__linea{
		display: none;
	}
}

