h1{
	transform:translateY(-70px);
	text-align: center;
	background-image: linear-gradient(45deg,#f42,#5d3);	
	-webkit-text-fill-color:transparent;
	-webkit-background-clip: text;
	position: fixed;
	margin-left:130px;
}

.sombra{
	text-shadow: -1px -1px 0px #fff, 1px 1px 0px #000, 3px 3px 5px #222, 10px 10px 15px #333, 20px 20px 30px #555;
	position:fixed;
}
/*
input{
	box-shadow: 2px 2px 4px #333;
	height: 24px;
	border-radius: 6px;
}
*/
.button{
	text-align: center;
	border-radius: 5px;
	height: 30px;
	width: 75px;
	color:#f00;
	-webkit-text-stroke: .2px;
	transition: .2s;
	background: linear-gradient(#bbb,#fff,#fff,#aaa);
	width: 100px;
}

.button:hover{
	color: #00f;
	cursor:pointer;
	transform: scale(1.2);
	box-shadow: 6px 6px 8px #333;
	background: linear-gradient(#dfd,#ddf);
}

input,tr{
	height: 20px;
	
}


/* Para crear los espacios donde va la información del estudiante en las funciones pagar o confirmar */
.intro{
	outline: none;
	border-style: none;
	padding-left:20px;
	width: 98%;
	border-style:none;
	border-width: 1px;
	border-color: rgba(0,0,0,.2);
	border-radius: 4px;
	height: 22px;
	
}
.tabla{
	background-image: linear-gradient( #B3CEA1,#fff,#B3CEA1);
	border-radius: 12px;
	box-shadow: 3px 3px 7px #555;
}

#info{
	color:red;
	font-size: 9px;
	background:#fff;
	border-style:solid;
	border-width: 1px;
	border-color: rgba(0,0,0,.3);
	border-radius: 6px;
	padding: 5px;
	width: 20%;
	
}
/* hasta aqui la creación de espacios para mostrar información */



/* para los  botones de pagar y confirmar */

.btn{
	height: 50px;
	width: 95%;
/*	background-image:linear-gradient(#B3CEA1,#fff,#B3CEA1);*/
	background-image: linear-gradient(120deg, rgba(255,0,0, .5) 10%, rgba(255,0,0, .2) 50%, rgba(255,0,0, .5) 100%);
	border-width: 1px;
	border-radius: 10px;
	color:#fff;
	-webkit-text-stroke: 1px #000;
    -webkit-text-fill-color: #fff;
	text-shadow: 1px 1px 3px #000;
	font-size:20px;
	font-weight:bold;
	padding:0px 0px 0px 0px;
	margin:0px;
	transition: .3s;
	box-shadow: 2px 2px 10px #000;
}

.btn:hover{
	cursor:pointer;
	transform:scale(.95);
	background:#f00;
	box-shadow: 3px 3px 8px #444;
	
}

.btn:active{
	transform:scale(.93);
	background:#b00;
	box-shadow:1px 1px 0px #222;
	-webkit-text-stroke: 1px #f00;
	text-shadow: 2px 2px 0px #000;
}



/* Hasta aqui los botones de pagar y confirmar */


.but{
	
	background-image:linear-gradient(120deg, #88A375 10%,rgba(168,122,56,.5) 50%, #88A375 100%);
	text-shadow: 1px 1px 2px #000;
	font-weight: bold;
	cursor:pointer; 
	height:50px; 
	width:90%; 
	font-size:20px; 
	-webkit-text-stroke: 1px #000; 
	-webkit-text-fill-color: #Fff;
	border-radius: 10px;
	transition: .2s;
	box-shadow: 2px 2px 10px #000;
	letter-spacing: 0px;
	
}

.but:hover{
	transform: scale(.95);
	background:#88A375;
	-webkit-text-fill-color: #fff;
	box-shadow: 3px 3px 7px #444;
	cursor:pointer;
}

.but:active{
	transform:scale(.93);
	background:#608047;
	box-shadow:1px 1px 0px #222;
	-webkit-text-stroke: 1px #D2DD7E;
	text-shadow: 2px 2px 0px #000;
}



#flecha{
	width: 178px;
	height:20px;
	background-color:red;
	border: 1px solid #000;
	position: relative;
	cursor:pointer;
	font-family:arial;
	color:#fff;
	
	padding:10px;
	
	}
	#flecha:after{
		content:'';
		position: absolute;
		top:-6px;
		left:198px;
		width:0;
		height:0;
		border: 50px solid transparent;
		border-left: 12px solid #000;		


		border-top: 26px solid transparent;
		border-bottom: 26px solid transparent;
		border-left: 30px solid #F00;
		height: 0px;
		width: 2px;
		
	}

.msg{
	width:125px;
	height: 35px;
	border-radius:6px;
	background-image: linear-gradient(#aaa, #fff,#777);
	cursor:pointer;	
	box-shadow: 3px 3px 5px #555;
	transition: 0.3s;
}

.msg:hover{
	background-image: linear-gradient(#8c8, #fff,#7e7);
	transform:scale(1.1);
	box-shadow: 8px 8px 10px #555;
}

.msg:active{
	background-image: linear-gradient(#6c6, #ddd,#3a3);
	box-shadow: 1px 1px 3px #ddd;
}

#close{
	position:relative;
	height:30px;
	width:175px;
	background:red;
	color:#fff;
	border-style:solid;
	border-width:1px;
	border-radius:8px;
	transition:0.5s;
	border-top-color:rgba(255,255,255,.7);
	border-left-color:rgba(255,255,255,.7);
	font-size:14px;
/*	box-shadow: 2px 2px 3px #333; */
	box-shadow: 1px 1px 0px #000, 3px 3px 1px #333, 5px 5px 2px #555, 7px 7px 10px #555, 10px 10px 15px rgba(50,50,50,.5),15px 15px 20px rgba(70,70,70,0);
	text-shadow: 1px 1px 1px #000;
}


#close:hover{
	
	cursor:pointer;
	transform:scale(1.1) translateY(-8px);
	background:#f55;
/*	box-shadow:2px 20px 12px rgba(100,100,100,.5);*/
	box-shadow: 1px 1px 0px #000, 3px 3px 1px #333, 5px 5px 2px #555, 10px 10px 15px rgba(50,50,50,.5),15px 15px 20px rgba(70,70,70,0),
	10px 35px 12px rgba(75,75,75,.2);
}
#close:active{
	transition:0s;
	transform:scale(1) translateY(0px);
	background:#c00;
	box-shadow: 2px 1px 3px rgba(255,255,255,.5), 0px 0px 0px #000;
	border-right-color:#fff;
	border-bottom-color:#fff;
	border-top-color:#000;
	border-left-color:#000;
	text-shadow: 1px 1px 1px #000;
	
}



/*
input[type=time]{
	background:#fff;

}
input[type=time]:before{
	padding-left:7px;
	content: " 12:00 AM";
	color:#9d9d9d;
	text-align:center;
	position:absolute;
	background:#fff;
}

input[type=time]:focus:before{
	width:0;
	content:"";

}

*/
/*
input[type=text]:focus,
input[type=user]:focus,
input[type=password]:focus 
{
	outline: none !important;
    box-shadow: 1px 1px 5px green;
	box-shadow:0 0 0 .2rem rgba(119,158,108,.25);
	border-color:#779E6C;
	font-family: Arial, Helvetica, sans-serif;
}

*/