@font-face{
	font-family:Sansation_Regular;
	src:url(../../../fonts/Sansation_Regular.ttf);
}
@font-face{
	font-family:Rubik-Regular;
	src:url(../../../fonts/Rubik-Regular.ttf);
}
@font-face{
	font-family:Droid_Sans_Mono_Dotted_for_Powerline;
	src:url(../../../fonts/Droid_Sans_Mono_Dotted_for_Powerline.ttf);
}

@font-face{
	font-family:RobotoCondensed-Regular;
	src:url(../../../fonts/RobotoCondensed-Regular.ttf);
}

@font-face{
	font-family:OpenSans-Regular;
	src:url(../../../fonts/OpenSans-Regular.ttf);
}

@font-face{
	font-family:OpenSans-Light;
	src:url(../../../fonts/OpenSans-Light.ttf);
}

form {
	font-family: RobotoCondensed-Regular;
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-decoration: none;
	margin: 0px;
	padding: 10px;
	height: auto;
	width: 100%;
	border: thin none #000;
	box-sizing:border-box;
	display:inline-block;
}

label{
	font-family: RobotoCondensed-Regular;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-decoration: none;
	padding: 0px;
	height: auto;
	width: auto;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	display: inline-block;
	box-sizing: border-box;
}

label.required::before {
	content: "*";
	color: red;
	margin-right: 3px;
}

input, textarea, select {
	font-family: OpenSans-Regular;
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-decoration: none;
	background-color: #E5E5E5;
	padding: 12px;
	height: auto;
	width: 98%;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	border: thin solid #CCC;
	display: inline-block;
	box-sizing: border-box;
	border-radius: 5px;
}

input::placeholder,
textarea::placeholder {
	color: #888;
	opacity: 1;
	font-family: RobotoCondensed-Regular;
	font-size: 18px;
}

input:focus, textarea:focus, select:focus {
	outline: none;
	border-color: #FF8114;
	box-shadow: 0px 0px 5px 5px #FFDCBD;
	animation: parpadeo 0.5s infinite alternate; /* ðŸ‘ˆ aquÃ­ estÃ¡ la magia */
}

/* Animación */
@keyframes parpadeo {
	0% {
		box-shadow: 0px 0px 0px 0px #FFDCBD;
	}
	100% {
		box-shadow: 0px 0px 10px 5px #FFDCBD;
	}
}

.button1{
	font-family: RobotoCondensed-Regular;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #FFF;
	text-decoration: none;
	background-color: #7C3AED;
	text-align: center;
	padding: 10px;
	height: auto;
	width: auto;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	border: thin solid #7C3AED;
	cursor: pointer;
	box-sizing:border-box;
	display:inline-block;
	border-radius:5px;
}

.button2{
	font-family: RobotoCondensed-Regular;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
	text-decoration: none;
	background-color: #CCC;
	text-align: center;
	padding: 10px;
	height: auto;
	width: auto;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	border: thin solid #CCC;
	cursor: pointer;
	box-sizing:border-box;
	display:inline-block;
	border-radius:5px;
}

#modalAgenda{
	background:rgba(15,11,56,.75);
	backdrop-filter:blur(6px);
	-webkit-backdrop-filter:blur(6px);
	margin:0;
	padding:20px;
	width:100%;
	height:100%;
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:1;
	display:none;
	box-sizing:border-box;
}

#modalAgenda #windowAgenda{
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#333;
	background:#FFF;
	width:100%;
	max-width:700px;
	max-height:90vh;
	padding:35px;
	position:relative;
	margin:auto;
	top:50%;
	transform:translateY(-50%);
	border-radius:20px;
	box-shadow:0 20px 60px rgba(0,0,0,.30);
	overflow-y:auto;
	box-sizing:border-box;
	animation:showWindow .30s ease;
}

#modalAgenda #windowAgenda::-webkit-scrollbar{
	width:8px;
}

#modalAgenda #windowAgenda::-webkit-scrollbar-thumb{
	background:#CCC;
	border-radius:10px;
}

#modalAgenda #windowAgenda #closeAgenda{
	position:absolute;
	top:15px;
	right:15px;
	width:38px;
	height:38px;
	line-height:38px;
	text-align:center;
	background:#DC3545;
	color:#FFF;
	font-size:20px;
	font-weight:bold;
	cursor:pointer;
	border-radius:50%;
	transition:.3s;
	box-shadow:0 5px 15px rgba(220,53,69,.30);
}

#modalAgenda #windowAgenda #closeAgenda:hover{
	transform:rotate(90deg) scale(1.08);
	background:#c82333;
}

@keyframes fadeModal{

	from{
		opacity:0;
	}

	to{
		opacity:1;
	}

}

@keyframes showWindow{

	from{
		opacity:0;
		transform:translateY(-45%) scale(.95);
	}

	to{
		opacity:1;
		transform:translateY(-50%) scale(1);
	}

}

@media(max-width:768px){

	#modalAgenda{
		padding:15px;
	}

	#modalAgenda #windowAgenda{
		width:100%;
		padding:25px 20px;
		border-radius:15px;
	}

}