@charset "UTF-8";
/* CSS Document */
@viewport{
    zoom: 1.0;
    width: extend-to-zoom;
}
/* ====================== */
#correo{
	width:90%;
	background: rgba(0, 0, 0, 0.1);
	margin:0 auto;
	padding: 0 5%;
	position:relative;
	z-index:10;
	text-align: left;
	white-space: normal;
	border-radius: 5px;
	}
	
#correo .comment{
		font-weight: normal;
		margin:.5em;
		background:;
		font-size: .7em;
		color: #e1e4da;
		padding: 2em 0 0 0;
		}
		
#correo .comment div{
	margin-bottom:0px;
	vertical-align:middle;
	}

/*-----campos de datos----------*/	
#correo input{
	border: none;
	border-left: 1px solid rgb(246, 239, 9);
	padding: .5em 5%;
	width: 90%;
	margin: .3em 0;
	background: rgba(255, 255, 255, .3);
	border-radius: 5px;
	font-size: 1em;
	}
/*-----campos de texto----------*/	
#correo textarea{
	border: none;
	border-left: 1px solid rgb(246, 239, 9);
	padding: .5em 5%;
	width: 90%;
	margin: .5em 0;
	background: rgba(255, 255, 255, .3);
	height: 120px;
	border-radius: 5px;
	font-size: 1em;
	} 

/*-----boton----------*/	
#correo input[type="submit"] {
	cursor: pointer;
	width: 100%;
	background: rgba(47, 137, 171, 1);
	border: none;
	color:#e1e4da;
	font-size: 1em
	}

#correo input[type="submit"]:hover {
	cursor: pointer;
	width: 100%;
	background: rgba(131, 184, 200, 1);
	border: none;
	color:#e1e4da;
	font-size: 1em
	}

	
	
/*color de texto placeholer
=============================*/		
	::-webkit-input-placeholder { color:#e1e4da; font-size: .8em;} /* WebKit */
:-moz-placeholder { color:#e1e4da; font-size: .8em; } /* Firefox 18- */
::-moz-placeholder { color:#e1e4da; font-size: .8em; } /* Firefox 19+ */
:-ms-input-placeholder { color:#e1e4da; font-size: .8em; } /* IE 10+ */

	/* ========================================================================== PORTRAIT == */
	
	/* 320 X 360 */                /* SmartPhone */
@media screen and (min-width: 20em)and (max-width: 22.5em) and (orientation: portrait) {
	#correo{
	width:100%;
	background: none;
	margin:0 auto;
	padding: 0;
	position:relative;
	z-index:10;
	text-align: left;
	}

	}
	
	/* 375 X 414 */                 /* SmartPhone */
@media screen and (min-width: 23.43em)and (max-width: 26em) and (orientation: portrait) {
#correo{
	width:100%;
	background: none;
	margin:0 auto;
	padding: 0;
	position:relative;
	z-index:10;
	text-align: left;
	}
	}
	
/* 768 X 800 */                 /* Ipad */
@media screen and (min-width: 48em)and (max-width: 50em) and (orientation: portrait) {
		#correo{
	width:75%;
	background: none;
	margin:0 auto;
	padding: 0;
	position:relative;
	z-index:10;
	text-align: left;
	}
	}	
	
/* 834 X 1024 */                 /* Ipad Pro */
@media screen and (min-width: 52.12em)and (max-width: 64em) and (orientation: portrait) {
		#correo{
	width:75%;
	background: none;
	margin:0 auto;
	padding: 0;
	position:relative;
	z-index:10;
	text-align: left;
	}
	}
		
	/* ========================================================================== LANDSCAPE == */
		/* 568 X 740 */                 /* SmartPhone */
@media screen and (min-width: 35.5em)and (max-width: 46.25em) and (orientation: landscape) {
	#correo{
	width:100%;
	background: none;
	margin:0 auto;
	padding: 0;
	position:relative;
	z-index:10;
	text-align: left;
	}
	}	

	/* 812 X 846 */                  /* SmartPhone */
@media screen and (min-width: 50.75em)and (max-width: 52.87em) and (orientation: landscape) {
	#correo{
	width:100%;
	background: none;
	margin:0 auto;
	padding: 0;
	position:relative;
	z-index:10;
	text-align: left;
	}
	}
	
		/* 960 X 1112 */                 /* Ipad */	
@media screen and (min-width: 60em)and (max-width: 69.5em) and (orientation: landscape) {

	}
	


		/* 1280 X 1336 */	                /* Ipad Pro */
@media screen and (min-width: 80em)and (max-width: 83.5em) and (orientation: landscape) {
	
	}