@charset "utf-8";
@font-face {
    font-family: "font1";
    src: url( "../fonts/OpenSans-Light.ttf") format("truetype");
	font-display: swap;
}
@font-face {
    font-family: "font2";
    src: url( "../fonts/OpenSans-Medium.ttf") format("truetype");
	font-display: swap;
}
@font-face {
    font-family: "font3";
    src: url("../fonts/OpenSans-Regular.ttf") format("truetype");
	font-display: swap;
}
@font-face {
    font-family: "font4";
    src: url("../fonts/OpenSans-Bold.ttf") format("truetype");
	font-display: swap;
}
@font-face {
    font-family: "font5";
    src: url("fonts/OpenSans-ExtraBold.ttf") format("truetype");
	font-display: swap;
}
		body {
			margin-left: 0px;
			margin-top: 0px;
			margin-right: 0px;
			margin-bottom: 0px;
		}
		.raleway-n20 {
			font-family: font2;
			font-size: 1.2vw;
			color: #333;
			margin: 10px;
			line-height: 160%;
			text-align: center;
			margin-top: 30px;
		}

		.raleway-b20 {
			font-family: font1;
			font-size: 1.2vw;
			color: #fff;
			line-height: 1.5vw;
			letter-spacing: 1px;
		}

		.raleway-b10 {
			font-family: font1;
			font-size: 13px;
			color: #FFF;
			line-height: 25px;
		}

		.raleway-n40 {
			font-family: font2;
			font-size: 3vw;
			color: #333;
		}

		.raleway-n30 {
			font-family: font1;
			font-size: 25px;
			color: #333;

		}

		.raleway-b30 {
			font-family: font1;
			font-size: 2.5vw;
			color: #FFF;
		}

		.raleway-b40 {
			font-family: font3;
			font-size: 3vw;
			color: #FFF;
		}

		.raleway-b100 {
			font-family: font1;
			font-size: 200px;
			color: #FFFFFF;
			line-height: 100%;
		}

		.boton-consulta {
			text-align: center;
			color: #fff;
			font-family: font4;
			font-size: 1.2vw;
			width: 40%;
			padding: 15px;
			background-color: #2ce0f8;
			margin: auto;
			border-radius: 15px;
			
		}

		.botonform {
			text-align: center;
			color: #fff;
			font-family: font2;
			font-size: 1.6vw;
			width: 40%;
			padding: 20px;
			background-color: #8080ff;
			border: 0px;
			margin: auto;
			border-radius: 15px;
		}


		.tabla {
			float: left;
			height: 660px;
			width: 100%;
			background-image: url("../img/banerh.webp");
			background-size: cover;
		}
		input {
			padding: 20px;
			font-family: font1;
			font-size: 1.3vw;
			border-radius: 10px;
			color: #666;
			text-align: left;
			alignment-adjust: central;
			width: 55%;
			margin: 8px;
			font-weight: bolder;
			box-shadow: -3px 3px 8px #666;
			border: 0px
		}

		textarea {
			padding: 20px;
			font-family: font1;
			font-size: 1.3vw;
			border-radius: 10px;
			color: #666;
			text-align: left;
			alignment-adjust: central;
			width: 55%;
			margin: 8px;
			border: 0px;
			box-shadow: -3px 3px 8px #666;
			font-weight: bolder;
			letter-spacing: 1px;
		}
        .div10 {
	    width: 8%;
	    padding: 1%;
	    float: left;
        }

        .div20 {
	    width: 18%;
	    padding: 1%;
	    float: left;
        }

        .div30 {
	    width: 23%;
        margin-left: 2%;
	    padding: 0.5%;
	    float: left;
        background-color: #fff;
        border-radius: 10px;
        }
        .div40 {
	    width: 38%;
	    padding: 1%;
		padding-top: 3%;
	    float: left;
        text-align: center;
        }
        .div60 {
	    width: 58%;
	    padding: 1%;
	    float: left;
        text-align: center;	
        padding-top: 5%;
        }
        .div100 {
	    width: 98%;
        padding: 1%;
	    float: left;
        text-align: center;
         }
		.vistah {
			display: block;
		}

		.vistav {
			display: none;
		}

		@media screen and (max-width:1000px) {
		.div10 {
	    width: 0%;
	    padding: 1%;
	    float: left;
        }
        .div20 {
	    width: 18%;
	    padding: 1%;
	    float: left;
        }
        .div30 {
	    width: 96%;
	    padding: 1%;
        float: none;
        background-color: #fff;
        border-radius: 10px;
        margin-top: 15%;
        margin-bottom: 10%;
        }
        .div40 {
	    width: 98%;
	    padding: 1%;
	    float: left;
        text-align: center;
        }
        .div60 {
	    width: 98%;
	    padding: 1%;
	    float: left;
        text-align: center;	
        padding-top: 5%;
        }
        .div100 {
	    width: 92%;
        padding: 4%;
	    float: left;
        text-align: center;
        }
		.tablaform {
			width: 100%;
			float: inherit;
		}

		.raleway-a20 {
			font-family: font1;
			font-size: 40px;
			color: #70a1a6;
		}

		.raleway-n20 {
			font-family: font1;
			font-size: 5vw;
			color: #333;
			margin: 10px;
		}

		.raleway-b20 {
			font-family: font1;
			font-size: 4vw;
			color: #fff;
			line-height: 15vw;
			margin-top: 8%;
		}

		.raleway-b10 {
			font-family: font1;
			font-size: 3vw;
			color: #fff;
		}

		.raleway-n40 {
			font-family: font1;
			font-size: 5vw;
			color: #333;
			line-height: 13vw;

		}

		.raleway-n30 {
			font-family: font1;
			font-size: 5vw;
			color: #333;
			line-height: 100px;
			margin: 10%;
		}

		.raleway-b40 {
			font-family: font1;
			font-size: 8vw;
			color: #FFF;
			line-height: vw;
		}

		.raleway-b100 {
			font-family: font1;
			font-size: 200px;
			color: #FFFFFF;
			line-height: 100%;
		}


		.boton-consulta {
			text-align: center;
			color: #fff;
			font-family: font4;
			font-size: 4.2vw;
			width: 40%;
			padding: 15px;
			background-color: #2ce0f8;
			margin: auto;
			border-radius: 15px;
			
		}

		.botonform {
			background: #b9005c;
			text-align: center;
			color: #fff;
			font-family: font1;
			font-size: 7vw;
			margin-top: 25px;
			letter-spacing: 0.1em;
			width: 50%;
			padding: 25px;
		}

		.tabla {
			float: left;
			height: 1200px;
			width: 100%;
		}


		.vistah {
			display: none;
		}

		.vistav {
			display: block;
		}
		input {
			padding: 6%;
			font-family: font1;
			font-size: 4vw;
			color: #666;
			text-align: left;
			alignment-adjust: central;
			border-radius: 20px;
			width: 70%;
			margin-top: 15px;
		}

		textarea {
			padding: 6%;
			font-family: font1;
			font-size: 4vw;
			color: #666;
			text-align: left;
			alignment-adjust: central;
			border-radius: 20px;
			width: 70%;
			margin-top: 15px;
		}
	}