
* {
	margin: 0;
	padding: 0;
}
body, html {
  height: 100%;
}
/*menu*/
header{
	width: 100%;
	  position: fixed;
}
nav{
	width: 100%;
    background: #2c285b;
    opacity: 0.9;
    filter: alpha(opacity=50);
    position: fixed;
	/* top: 82px;*/
}



 nav ul{
	overflow: hidden;
	list-style: none;
    
}
 nav ul li {
     float: none;
    display: inline-block;
}
 nav ul li a{
	color: white;
	padding: 42px;
	display:block;
	text-decoration: none;
	font-family:Ubuntu;
}
 nav ul li a:hover{
	background: #d2d2d2;
	color:black;
}
section{
	padding: 20px;
}
.nosot {
	width:auto;
	height:auto;
	background: #d2d2d2 /*gris*/;

}

.nosot p{
	font-family:Ubuntu;
	color: #2c285b;
	font-size: 20px;
	align-content: center;
	border-bottom: 2px solid rgb(44, 40, 91);
    padding: 10px;
	margin-left: auto;
    margin-right: 0px;
	margin-bottom: 0px;
	margin-top: auto;
}


.nosot h2{
	font-family:Ubuntu;
	color: #2c285b /*Azul*/;
	font-size: 30px;


}


.efecto:target{
    height:100%;
}

.efecto{
    overflow:hidden;
    position:relative;
    font-size:3em;
    width:100%;
    height:0;
    -webkit-transition: all 500ms ease-out;
    -moz-transition:all 500ms ease-out;
    transition: all 500ms ease-out;

}


.menu_bar {
    display: none;
}


header  div#encabezado_pag{
	width: 100%;
	background-color: #d2d2d2;
	height: 100%;
	align-content: center;
	align-items: center;

}


header div p{
	color:#2c285b/*Azul*/;
	font-family: Ubuntu;
	font-size: 25px;
}
.grisconten {
	width: 100%;
	height: 100%;
	font-family:Ubuntu;
	color: #235ba7/*Azul*/;
	background: #d2d2d2;
	font-size: 30px;
}

.grisconten h2 {

	font-family:Ubuntu;
	color: #2c285b;
	font-size: 30px;
	text-shadow: 0 0 3px  #ffff /*gris*/;
	margin: auto;
  width: 50%;
  height:auto;
  padding: 2px;
}

.contactanos {
	width:100%;
	height:100%;
	background: #d2d2d2 /*gris*/;
	padding-bottom: 25px;
    padding-top: 15px;


}

.contactanos p{
	font-family:Ubuntu;
	color: #235ba7/*Azul*/;
	font-size: 20px;
	margin: 20px;
	border: 6px solid #235ba7;
	border-radius: 20px;
    padding: 10px;
	margin-left: auto;
    margin-right: 0px;
	margin-bottom: 0px;
	margin-top: auto;
}


.contactanos h2{
	font-family:Ubuntu;
	color: #2c285b /*Azul*/;
	font-size: 30px;

}


.contactanos a{
	font-family:Ubuntu;
	color: white;
	font-size: 20px;
	text-decoration: none;
}


.nav{
	display: block;
	z-index: 2;
}
nav ul li{
 text-shadow: 0 0 3px  #d2d2d2 /*gris*/;
}
.column {
  float: left;
  width: 25%;
  padding: 20px;
  counter-increment: section;
}

.column h2{
  font-family: ubuntu;
  color: #2c285b;
  font-size: 30px;
}

.column p{
  font-family: ubuntu;
  color: #2c285b;
  font-size: 16px;
}

.columna {
  float: left;
  width: 48%;
  padding: 20px;
  counter-increment: section;
}

.columna h2{
  font-family: ubuntu;
  color: #2c285b;
  font-size: 30px;
}

.columna p{
  font-family: ubuntu;
  color: #2c285b;
  font-size: 16px;
}

.columnas {
  float: left;
  width: 65%;
  /* padding: 20px;*/
  counter-increment: section;
}

.columnas h2{
  font-family: ubuntu;
  color: #235ba7;
  font-size: 30px;
}

.columnas p{
  font-family: ubuntu;
  color: #235ba7;
  font-size: 20px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
  border: 20px;
}
.img{
	background-image:url("img/1.jpg");
	width: 100%;
	height:100%;
}

.parallax {
  background-image: url('img/1.jpg');
  min-height:800px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  object-fit: cover;
  width: 100%;
  padding-bottom: 25px;

}

.parallax2 {
  background-image: url('img/2.jpg');
  min-height: 500px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}
.parallax3 {
  background-image: url('img/3.jpg');
  min-height: 500px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}
.parallax4 {
  background-image: url('img/4.jpg');
  min-height: 500px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}
.parallax5 {
  background-image: url('img/5.jpg');
  min-height: 500px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;


}
div.transbox {
 /* padding: 60px; */
  background-color:  rgba(44, 40, 91,.6) /*azul*/;
  /*border: 50px solid black;*/
  filter: alpha(opacity=60);
  align-content: center;
  margin: 10%;
  padding: 35px;
  border-radius: 25px;
  box-shadow: 1px 1px 15px rgba(97, 44, 44,1.00);
  
}



div.transboxc {
 /* padding: 60px; */
  background-color:  rgba(0, 51, 123,0.6) /*azul*/;
  /*border: 50px solid black;*/	
  filter: alpha(opacity=60);
  align-content: center;
}

.transbox ul li {
  font-family: ubuntu;
  color: white;
  font-size:20px;
  border-bottom: 2px solid rgba(255,255,255,.3);
  list-style-image: url("img/list.png");
  margin-top: 30px;
}

.list ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 200px;
  font-family: ubuntu;
  border: 10px;

}

.list ul li{
	text-shadow: 0 0 3px  #fff ;
	border-bottom: 2px solid rgba(33, 30, 76,1.00);

}

.list ul li a {
  display: block;
  color: #2c285b /*Azul*/;
  padding: 8px 16px;
  text-decoration: none;
  font-size: 16px;
}

.list ul li a:hover{
 background: #235ba7;
}

/* Change the link color on hover */
/*.list li a:hover {
  background-color: #555;
  color: white;
}
*/
.encs h2{
	font-family: ubuntu;
	color: white;
	font-size: 30px;
}

.enc ul il {
  font-weight: ubuntu;
  color: black;
  font-size:30px;

}



p{
	color: white;
	font-family: Ubuntu;
	font-size: 30px;
}
.footer{
	width: 100%;
	height: 100%;
    color: white;
	background-color: #2c285b;
	padding:15px;
	font-size: 13px;
}

.link{
	color:  #d2d2d2;
	text-decoration: none;
	font-size: 25px;
   text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
}

.link:hover{
	color: #fff;
}

/*carrusel*/
* {box-sizing: border-box;}
body {font-family: ubuntu, ubuntu;}
.mySlides {display: none;}
img {vertical-align: middle;box-shadow: 5px 5px 15px #000;}

.slideshow-container {
  max-width: 1000px;
  margin: auto;
}

.text {
  color: white;
  font-size:20px;
  bottom: 8px;
  width: 100%;
  text-align: center;
  font-family: ubuntu;
}

.text1 {
  color: white;
  font-size:20px;
  bottom: 8px;
  width: 100%;
  text-align: center;
  font-family: ubuntu;
  padding: 15%;
}

.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  top: 0;
}

.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 4s ease;
}
.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 4s;
  animation-name: fade;
  animation-duration: 4s;
}


/*fin carrusel*/

div.transboxvmv {
 /* padding: 60px; */
  height: 680px;
  border-radius: 25px;
  background-color:  rgba(44, 40, 91,0.7) /*azul*/;
  /*border: 50px solid black;*/
  filter: alpha(opacity=60);
  align-content: center;
  margin: 10%;
  padding: 35px;
  box-shadow: 5px 5px 15px rgba(97, 44, 44,1.00);
}

div.transboxblan {
 /* padding: 60px; */
  box-shadow:  5px 5px 15px rgba(97, 44, 44,0.6) ;
  /*border: 50px solid black;*/
  filter: alpha(opacity=60);
  align-content: center;
  padding: 10px;
  border-radius: 25px;
  background-color:  rgba(44, 40, 91,0.7)/*azul*/;
  margin-top:10px;
  margin-bottom:10px;
  margin-left: 10px;
  margin-right: 10px;

}





div.transboxblan h2{
	font-family: ubuntu;
	color: rgb(255,255,255);
	font-size: 30px;

}

div.transboxblan p{
	font-family: ubuntu;
	color: #fff;
	font-size: 20px;

}

div.transboxnos {
 /* padding: 60px; */
  box-shadow:  5px 5px 15px rgba(97, 44, 44,0.6) ;
  /*border: 50px solid black;*/
  filter: alpha(opacity=60);
  align-content: center;
  padding: 10px;
  border-radius: 25px;
  background-color:  rgba(44, 40, 91,0.7)/*azul*/;
  margin-top:10px;
  margin-bottom:10px;
  margin-left: 10px;
  margin-right: 10px;

}





div.transboxnos h2{
	font-family: ubuntu;
	color: rgb(255,255,255);
	font-size: 30px;

}

div.transboxnos p{
	font-family: ubuntu;
	color: #fff;
	font-size: 20px;

}


#telefono{
		max-width: 300px
	}
/*:v*/
.bounce-top {
	-webkit-animation: bounce-top 0.9s both;
	        animation: bounce-top 0.9s both;
	z-index: -2;
}

.degradado{
	width: 100%;
	height: 100%;
	background-color:#d2d2d2/*Gris*/;
	padding: 20px;
}

table{
	max-width: 1000px;
	max-height: 900px;

}
/*E-mail*/
input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc ;
  border-radius: 10px;
  resize: vertical;
}


input.exitoform{
	    border: 2px solid #4d9814;
    box-shadow: 0 3px;
    border-radius: 15px;
}

label {
  padding: 12px 12px 12px 0;
  display: inline-block;
  color: white;
  font-size: 35px;
}

input[type=submit] {
  background-color: #211e4c;
  color: white;
  padding: 12px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  float: unset;
  margin-top: 15px;
}

input[type=submit]:hover {
  background-color: #211e4c/*Azul*/;
}

.contain {
  border-radius: 5px;
  padding: 20px;
}

.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}

.modal-contenido{
  background-color:#d2d2d2/*Gris*/;
  width:100%;
  padding: 30px 40px;
  margin: 10% auto;
  position: relative;


}
.modal{
  background-color: rgba(0,0,0,.8);
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
  overflow: auto;
}
#miModal:target{
  opacity:1;
  pointer-events:auto;
}

.modal-contenido p{
	color: #235ba7/*Azul*/;
	font-family: ubuntu;
	font-size: 15px;
}



.buton {
	background-color:  #235ba7/*Azul*/;
	padding: 15px;
	color: white;
	font-family: ubuntu;
	text-decoration:none;
	border-bottom: solid 1px black;
	font-size: 14px;
}

.buton2 {
	background-color:  #235ba7/*Azul*/;
	padding: 8px;
	color: white;
	font-family: ubuntu;
	text-decoration:none;
	margin-left: 80%;
}

.buton3 {
	background-color:  #235ba7/*Azul*/;
	padding: 8px;
	font-family: ubuntu;
	text-decoration:none;
	margin:10px;
}

.buton4{

  background-color: #211e4c;
  color: white;
  padding: 12px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  
  float: right;
  margin-top: 15px;
}



label.oculto{
	display: none;
}
label.mostrar{
	display: block;
	font-size: 25px;
  font-family:ubuntu;
	color: #e60000/*Rojo*/;
  text-shadow: 1px 1px 2px black, 0 0 5px darkblue;

}

.mostrar input{
  border:2px solid #e60000/*Rojo*/;
}

.enviado{
	display: block;
	font-size: 25px;
  font-family:ubuntu;
	color: #0ba71f/*verde*/;
	text-shadow: 1px 1px 2px black, 0 0 5px darkblue;

}

@media screen and (min-width:420px){
		.arrow{
		opacity: 0;
	}
}

@media screen and (max-width:450px){


	#correo{
		max-width: 300px
	}
}



@media screen and (max-width:600px){

	.buton4{
		width: 100%;
	}
	
.column {
   width: 100%;
 }
.columnas {
   width: 100%;
 }
.columna {
   width: 100%;
 }	
	
 div.transboxinc {
  background-color:  rgba(44, 40, 91,0.6) /*azul*/;
  /*border: 50px solid black;*/
  filter: alpha(opacity=60);
  align-content: center;

  border-radius: 25px;
  box-shadow: 5px 5px 15px rgba(97, 44, 44,1.00);
  width: 90%;
  height: 90%;
  margin-top: 30%;
  margin-right: 0px;
  margin-left: 0px;
  margin-bottom: 0px;
  padding: 35px;
}

	
	
div.transboxinc p{
	font-family: ubuntu;
	font-size: 30px;
	color: white;
	list-style:none;

}
}
@media screen and (min-width:900px){


.nosot p{
	font-family:Ubuntu;
	color: #2c285b;
	font-size: 20px;
	align-content: center;

}


.nosot h2{
	font-family:Ubuntu;
	color: #2c285b /*Azul*/;
	font-size: 40px;
}

.opacity ul li{
	opacity: 0;
}

}

@media (min-width:601px)  {
     
	.text{
		 padding: 15%;
	}
	
.column {
   width: 50%;
 }

div.transboxinc {
    background-color:  rgba(44, 40, 91,0.6) /*azul*/;
    filter: alpha(opacity=60);
    align-content: center;

    border-radius: 25px;
   box-shadow: 5px 5px 15px rgba(97, 44, 44,1.00);
    width: 90%;
	height: 360px;
	margin-top: 14%;
	margin-right: 0px;
    margin-left: 0px;
    margin-bottom: 0px;
    padding: 35px;
}

div.transboxinc p{
	font-family: ubuntu;
	font-size: 25px;
	color: white;
	float: inherit;
    padding-top: 10%;
}
	

div.transboxipar ul li{
	font-family: ubuntu;
	font-size: 20px;
	color: white;
	list-style:none;

}
	
}

@media   (min-width:901px){
	/*div.transboxinc{opacity: 0;}*/
	.column {width: 25%;
 }
}

@media screen and (max-width:900px){
	
	nav{
		width: 100%;
		top: -100%;
		margin: 0;
		position: fixed;
	}
nav ul li {
		display: block;
		float: none;
		border-bottom: 1px solid rgba(255,255,255,.3);
		text-shadow: 0 0 3px #d2d2d2 /*gris*/;
	}
.menu_bar{
		display:block;
		width: 100%;
		background:#bebec5;
		position: fixed;

	}

#encabezado_pag{
	opacity: 0;
	}

.menu_bar .bt-menu {
		display: block;
		padding: 20px;
		background: #bebec5;
		color:#fff;
		text-decoration: none;
		font-weight: bold;
		font-size: 25px;
		box-sizing: border-box;
	   /* float: left;*/
	}

	/*.menu_bar .bt-click {
		display: block;
		padding: 20px;
		background: #bebec5;
		color:#fff;
		text-decoration: none;
		font-weight: bold;
		font-size: 25px;
		box-sizing: border-box;
	    float: none;
	}
	*/
	.parallax {

  min-height: 500px;

}

  



}/*llave finas @media*/

@media screen and (max-width: 600px) {
  .col-25, .col-75, input[type=submit] {
    width: 100%;
    margin-top: 15px;
	
  }
}
/*fin E-mail*/

.jello-horizontal {
	-webkit-animation: jello-horizontal 0.9s both;
	        animation: jello-horizontal 0.9s both;
}

/* ----------------------------------------------
 * Generated by Animista on 2019-7-17 11:0:10
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation jello-horizontal
 * ----------------------------------------
 */
@-webkit-keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }

}
@keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }

}