.modal-title{
	color: black;
	font-weight: bolder;
    /*text-shadow: -2px -2px 2px  #F25A05, 2px -2px 2px  #F25A05, -2px 2px 2px  #F25A05, 2px 2px 2px  #F25A05;*/

}
.modal-body{
	 position: relative;
    text-align: justify;
    font-weight: bolder;
    
}
div.carousel-inner{
	width: 100%;
	height: 86vh;
}
.todos{
	display:flex ;
	align-items: center;
	justify-content: center;
	 height: 500px;

}

.tit{
	text-align: center; 
	margin-top: 20px; 
	color: white; 
	font-weight:700;
	text-shadow: -3px -3px 3px  #F25A05, 3px -3px 3px  #F25A05, -3px 3px 3px  #F25A05, 3px 3px 3px  #F25A05;
}
.BotonSecciones{
  border-radius: 5px;
  padding: 10px 7px;
  text-decoration: none;
  color: #fff;
  background-color: #F24405;
  margin: 15px;
  width: 120px;
  text-align: center;
  
}
/*.card:hover{
	box-shadow: 20px 20px 80px -44px black;
	transition: .5s ease-in-out;
	cursor: pointer;
}*/
button {
  background-color: #47a386;
  border: 0;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  color: #fff;
  font-size: 14px;
  padding: 10px 25px;
}

.ventana {
  display: flex;
  background-color: rgba(0, 0, 0, 0.3);
  align-items: center;
  justify-content: center;
  position: fixed;
  pointer-events: none;
  opacity: 0;  
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  transition: opacity 0.3s ease;
}


.vent {
  background-color: #fff;
  width: 600px;
  max-width: 100%;
  padding: 30px 50px;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  text-align: center;
}

.vent h1 {
  margin: 0;
}

.vent p {
  opacity: 0.7;
  font-size: 14px;
}
/*Animaciones botones*/
.carta{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 290px;
	height: 290px;
	padding: 1em;
	text-align: center;
	background: #26BBBB;
	border-radius: .8em;
	color: white;
	cursor: pointer;
	overflow: hidden;
	z-index: 1;
		display: flex;
	align-items: center;
	 justify-content: center;
	 flex-direction: column;


}
.carta:hover{
	color: white;

}
.carta h4{
	color: white;
	margin: 10px 0;
	text-shadow: -2px -2px 2px  #F25A05, 2px -2px 2px  #F25A05, -2px 2px 2px  #F25A05, 2px 2px 2px  #F25A05;
}
.targetas{
	display: grid;
	place-items: center;
	position: relative;
	width: 300px;
	height: 300px;
	border-radius: 1em;
	/*background: linear-gradient(50deg, #2a5a3b, #1e4886);*/
	background: linear-gradient(90deg, white, white);
	box-shadow: 20px 20px 80px -44px black;

	overflow:hidden;

	 margin: 20px;
}
.targetas::before{
	content: "";
	position: absolute;
	width: 450px;
	height: 35px;
	top: 0;
	right: 35px;
	transition: 2s;
	background: linear-gradient(90deg, #F25A05, #F25A05);
	transform: rotate(-45deg) translate(0, -100px);
}
.targetas:hover::before{
	animation: cardEffect 2s;
}
@keyframes cardEffect{
	100%{
		transform: rotate(-45deg) translate(0, 450px);
	}
}
     
.modal-body, .imagenes{
	display: flex;
	justify-content: center;
	
} 
img.resImg{
    display: flex;
	justify-content: center;
		width: 550px;
	}
 
.modal-title{
	display: flex;
	justify-content: center;
}   
img.iconitos{
    width:50px;
}
/*Responsive*/
@media (max-width: 720px){

	.targetas{
		width: 150px;
	  height: 120px;
	  display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 5px;



	}
	.cartas{
	    	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
		width: 150px;
	height: 90px;
		
	
	}
	img.iconitos{
	     margin:2px 0;
    width:20px;
}
h4.M1{
     margin:2px 0;
	font-size: 9px;
	
}
h4.M2{
     margin:2px 0;
	font-size: 15px;
	
}
h4.M3{
     margin:2px 0;
	font-size: 15px;
	
}
h4.M4{
     margin:2px 0;
	font-size: 15px;
	
}
h4.M5{
    margin:2px 0;
	font-size: 10px;
	
}
.BotonSecciones{
font-size: 8px;
  width: 60px;
  
 
  
}
div.carousel-inner{
		width: 100%;
	height:25vh;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;

	}
	.todos{
	 height: 200px;
	}

	img.resImg{
		display: flex;
	justify-content: center;
		width: 70%;
	}
}