@import url('https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300&display=swap');
		@import url('https://fonts.googleapis.com/css2?family=News+Cycle&display=swap');
		body{
			margin:0;
			padding:0;
			top:0;
			background: url(ebook-ciencia-en-las-estructuras-repetitivas.png);
			background-size: 100%;
			background-position: center center;
			background-repeat: no-repeat;
			background-attachment: fixed;
			font-family: sans-serif;
		}
		main{
			margin:0;
			height:100%;
			background: linear-gradient( to right, 
			   rgba(191,63,63,.6) 0%,
			   rgba(191,63,63,.36) 2%,
			   rgba(32,255,88,.32) 30%,
			   rgba(45,203,255,.16) 60%,
			   rgba(20,219,235,.1) 80%,
			   rgba(0,0,0,0) 100%
			);
		}
		h1 p{color:#222;text-shadow:1px 1px 1px rgba(100%,100%,100%,0.5);background: linear-gradient( to right, rgba(100%,100%,100%,0.1) 0%, rgba(100%,100%,100%,.6) 100%);margin:0px;padding:0 0 0 14px; font-family: 'News Cycle', sans-serif;border-right:6px solid #fff;}
		h1 p:nth-child(1){width:185px;border-radius: 6px 0 0 0;}
		h1 p:nth-child(2){width:155px;}
		h1 p:nth-child(3){width:140px;border-radius: 0 0 0 6px;}
		h2{color:#fff;}h2 span{font-size: 100px}
		form{
			padding:32px;
			border-radius: 16px;
			width: 360px;
			box-shadow: 0 0 24px #fff;
			margin:36px 36px 0 36px;
			border:1px solid #fff;
			background: url(mini-ebook-ciencia-en-las-estructuras-repetitivas.png);
			background-attachment: fixed;
			background-repeat: no-repeat;
		}
		label, input{
			display: block;
			width:96%;
			padding:8px;
			font-size: 100%;
		}
		label{
			margin-top:16px;
			font-weight: bold;
			color:#fff;
			font-style: italic;
		}
		input{
			border: 0;
			border-radius: 4px;
		}
		input:focus{
			background: lightyellow;
		}
		input[type="text"]:hover,input[type="email"]:hover{
			background: lightyellow;
		}
		input[type="submit"]{
			background: #fff;
			border: 6px solid #0080FF;
			padding:24px;
			color:#0080FF;
			font-weight: bold;
			margin:0;
			width:100%;
			border-radius: 0 0 24px 24px;
			cursor:pointer;
		}
		input[type="checkbox"]{
			border:3px solid #000;
		}
		ul{width:135px;list-style-type: square;}
		ul li{
			background: yellow;
			margin:8px;
			padding:6px;
			border-radius: 90px;
		}
		footer{
			margin:40px;
			margin-bottom:0;
			font-size: 80%
		}
		.sprite {
		    background-image: url(https://tutorias.co/images/spriteFooter.png);
		    background-repeat: no-repeat;
		    display: block;
		}
		.sprite-facebook,.sprite-gplus,.sprite-if_LinkedIn_1298749,.sprite-twitter,.sprite-instagram,.sprite-pinterest,.sprite-youtube{width: 32px;height: 32px;display:inline-block;border-radius: 90px;border: 10px solid rgba(100%,100%,100%,0.2);}
		.sprite-facebook { background-position: -5px -5px; }
		.sprite-gplus { background-position: -47px -5px}
		.sprite-if_LinkedIn_1298749 { background-position: -89px -5px}
		.sprite-instagram {background-position: -79px -47px}
		.sprite-pinterest {background-position: -79px -89px}
		.sprite-twitter {background-position: -131px -5px}
		.sprite-youtube { background-position: -121px -47px}
		.sprite-if_Phone_408400 { width: 64px;height: 64px; background-position: -5px -47px}

		#divChk{display:block;margin:6px;}
		#divChk div{display:inline-block;width:90%;vertical-align: middle}
		#chk{
			background:lightyellow;
			font-size: 82%;
			color:#333;
		}
		#intoForm{
			font-size: 260%;
			font-weight: bold;
			text-align:center;
			color: #99FF66;
			background: #00CC33;
			padding:12px;
			margin:0;
		}
		#intoForm span{color: yellow;font-size: 100%}
		#logo{margin:12px;}
		#lema{font-size: 75%;color:#efefef;margin-top:-6px;margin-bottom:33px;font-family: sans-serif;}
		#divEncabezado{display:block;}
		#divEncabezado div{display:inline-block; vertical-align: middle}
		#intoRS{float: right}
		#encabezado{
			margin:0 12px 12px 12px;
			padding-left: 24px;
		}
		#encabezadoForm{
			background: rgba(0%,0%,0%,0.12);
			padding:16px;
			border-radius: 6px 6px 0 0;
		}
		#encabezadoForm2{
			background: rgba(0%,0%,0%,0.12);
			padding:10px;
		}
		#posTemario{
			width:210px;color:#fff;
			font-family:'Open Sans Condensed', sans-serif;
			font-size:144%;
			text-shadow: 1px 1px 1px #333;
		}

@media only screen and (max-width: 420px) {
  form {
    width:95%;
  }
  #divEncabezado{max-width:360px;}
  #posTemario{
  	font-size:180%;
  }
}