/*------------------------
---------CERRAR-----------
------------------------*/

.cerrar {
    display: block;
    position: relative;
    float: right;
    background: url(../cerrar.png) #e75533;
    width: 40px;
    height: 40px;
    text-indent: 999;
    border-radius: 50%;
    color: transparent;
    margin: -15px;
    cursor: pointer;
}

.cerrar:hover {background: url(../cerrar.png) #3dcbe2;}

/*------------------------
--FORMULARIO DE CONTACTO--
------------------------*/

#contenedor_cuadro,
#contenedor_adwords {	
position: absolute;	
width: 100%;	
height: 693%;
background: rgba(3,3,3,0.8);
top:0px;
margin: 0;
left:0;
display: none;
z-index: 999;    	
}

#contenedor_cuadro .topcontent,
#contenedor_adwords .topcontent {
	padding: 3% 5%;	
	margin-top: 120px;
	background-color:none;
}		
	
/* === Contact Form === */
#contenedor_cuadro #contact-form,
#contenedor_adwords #contact-form  
	{
	width:460px;
	margin:0px auto;
	text-align:left;
	padding:0px;
	background-color:#ffffff;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
	
/* === Contact Form Header === */	
#contenedor_cuadro h3,
#contenedor_adwords h3 
	{
	text-align:center;
	color:#ffffff;
	font-size:130%;
	padding-top:18px;
	-webkit-border-top-left-radius: 5px;
	-moz-border-top-left-radius: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-top-right-radius: 5px;
	border-top-right-radius: 5px;
}
	
#contenedor_cuadro h3{
	/*background-image: url(../assets/01.png);
	background-repeat:no-repeat;
	background-position:50% 100%;*/
	height:60px;
}

#contenedor_adwords h3{
	background-image: url(../../assets/adwords/logo-form.png);
	background-repeat:no-repeat;
	background-position:50% 80%;
	height:110px;
}

/* === Input Elements === */
#contenedor_cuadro input,
#contenedor_adwords input
	{	
	width: 78%;
	float: left;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-left:10%;
	margin-right:10%;
	height:40px;
	margin-top:15px;
	padding-left:10px;
	border-style:none;
	font-size:100%;
	outline: none;
	background-color:#f5f7f6;
	-webkit-box-shadow:inset 0 1px 0px rgba(204,204,204,1),0 0 0px rgba(204,204,204,1);
	box-shadow:inset 0 1px 1px rgba(204,204,204,1),0 0 0px rgba(204,204,204,1);
}

/* === SELECTOR DE PRODUCTOS=== */
#produc_cont {
	width: 78%;
	float: left;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-left:10%;
	margin-right:10%;
	height:40px;
	margin-top:15px;
	padding-left:10px;
	border-style:none;
	font-size:100%;
	outline: none;
	background-color:#f5f7f6;
	-webkit-box-shadow:inset 0 1px 0px rgba(204,204,204,1),0 0 0px rgba(204,204,204,1);
	box-shadow:inset 0 1px 1px rgba(204,204,204,1),0 0 0px rgba(204,204,204,1);
	color:#3dcbe2;
}

#contenedor_cuadro ::-webkit-input-placeholder {
	font-size:100%;
	font-family: 'Lato', sans-serif;
}

#contenedor_adwords::-webkit-input-placeholder {
	font-size:100%;
	font-family: 'Lato', sans-serif;
}
	
#contenedor_cuadro :-ms-input-placeholder{
	font-size:100%;
	font-family: 'Lato', sans-serif;
}

#contenedor_adwords :-ms-input-placeholder{
	font-size:100%;
	font-family: 'Lato', sans-serif;
}

/* === Text Area === */
#contenedor_cuadro #contact-form textarea,
#contenedor_adwords #contact-form textarea  
	{
	width:78%;
	height:75px;
	margin-left:10%;
	margin-right:10%;
	margin-top:15px;
	padding-left:10px;
	padding-top:10px;
	border: solid 0px transparent;
	outline: none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size:100%;
	background-color:#f5f7f6;
	border-color:none;
	outline:0;
	-webkit-box-shadow:inset 0 1px 0px rgba(204,204,204,1),0 0 0px rgba(204,204,204,1);
	box-shadow:inset 0 1px 1px rgba(204,204,204,1),0 0 0px rgba(204,204,204,1);
}

#contenedor_cuadro #contact-form textarea:focus,
#contenedor_adwords #contact-form textarea:focus {
	border-color:#e75533;
	outline:0;}
	
#contenedor_cuadro #contact-form input:focus, 
#contenedor_adwords #contact-form textarea:focus{
	background-color:#ebebeb;
	font-family: 'Lato', sans-serif;
	border: 2px solid #3dcbe2;
}
	
/* === Submit Button === */
#contenedor_cuadro #contact-form button,
#contenedor_adwords #contact-form button{
background-color: #ffa500;
cursor: pointer;
width: 78%;
height: 40px;
margin-left: 10%;
border: none;
color: #FFF;
margin-top: 20px;
margin-bottom: 30px;
font-size: 120%;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

/* === From this code on, concerns responsive. I only overrided the necessary styles to make it responsive ===*/
/* Large desktop */
@media (min-width: 1200px) {	  
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {	  
}
	
/* Landscape phone to portrait tablet */
@media (max-width: 767px)
{
	
#contenedor_cuadro #contact-form, #contenedor_adwords #contact-form {width:73%; padding:0px;}

/* === Input Elements === */
#contenedor_cuadro #contact-form label,
#contenedor_adwords #contact-form label {
	font-size:90%;
	display:block !important;
	}
	
#contenedor_cuadro input,
#contenedor_adwords input {	
	font-size:90%;
	padding-left:2%;	
	}

	
/* === Text Area === */
#contenedor_cuadro #contact-form textarea,
#contenedor_adwords #contact-form textarea {	
	font-size:90%;
	padding-left:2%;
	}

/* === Headers and Paragraph === */	
#contenedor_cuadro h3, #contenedor_adwords h3 {font-size:120%;}

#contenedor_cuadro h4, #contenedor_adwords h4 {font-size:110%;}
	
#contenedor_cuadro p,#contenedor_adwords p {font-size:85%;}
	
	
/* === Submit Button === */
#contenedor_cuadro #contact-form button[type="submit"], 
#contenedor_adwords #contact-form button[type="submit"] {font-size:100%;}

}

 /* Landscape phones and down */
@media (max-width : 480px)
{
		
#contenedor_cuadro #contact-form, #contenedor_adwords #contact-form {width:90%; padding:0px;}

/* === Input Elements === */
#contenedor_cuadro label,
#contenedor_adwords label
	{	
	font-size:90%;
	display:block !important;
	}

#contenedor_cuadro input,
#contenedor_adwords input
	{	
	font-size:90%;	
	padding-left:5%;	
	}

/* === Text Area === */
#contenedor_cuadro #contact-form textarea,
#contenedor_adwords #contact-form textarea {	
	font-size:90%;	
	padding-left:5%;
	}

	
/* === Headers and Paragraph === */	
#contenedor_cuadro h3, 
#contenedor_adwords h3, 
	{	
	font-size:120%;	
	}

#contenedor_cuadro h4,
#contenedor_adwords h4
	{font-size:110%;}
	
#contenedor_cuadro p,
#contenedor_adwords p  
	{font-size:85%;}	
	
/* === Submit Button === */
#contenedor_cuadro #contact-form button[type="submit"] 
	{font-size:100%;}

}

#contenedor_adwords #contact-form button[type="submit"] 
	{font-size:100%;}

}


@media (max-width : 250px)
{	
#contenedor_cuadro #contact-form,
#contenedor_adwords #contact-form  
	{width:100%;	
	padding:0px;}

/* === Input Elements === */
#contenedor_cuadro label,
#contenedor_adwords label
	{	
	font-size:90%;
	display:block !important;	
	}

#contenedor_cuadro input,
#contenedor_adwords input
	{font-size:90%;	
	padding-left:5%;}
	
/* === Text Area === */
#contenedor_cuadro #contact-form textarea,
#contenedor_adwords #contact-form textarea  
	{font-size:90%;	
	padding-left:5%;}

/* === Headers and Paragraph === */	
#contenedor_cuadro h3,
#contenedor_adwords h3 
	{font-size:120%;}

#contenedor_cuadro h4,
#contenedor_adwords h4
{font-size:110%;}

#contenedor_cuadro p,
#contenedor_adwords p 
{font-size:85%;}
	

/* === Submit Button === */
#contenedor_cuadro #contact-form button[type="submit"] 
	{font-size:100%;}

#contenedor_adwords #contact-form button[type="submit"] 
	{font-size:100%;}

}

/* === Application Form Header === */	
#contenedor_cuadro h3,
 #contenedor_adwords h3
	{background-color: #ffa500;}


/* === Submit Button === */
#contenedor_cuadro #contact-form button,
#contenedor_adwords #contact-form button
	{
background-color: #ffa500;
cursor: pointer;
width: 78%;
height: 40px;
margin-left: 10%;
border: none;
color: #FFF;
margin-top: 15px;
margin-bottom: 30px;
font-size: 120%;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
	
#contenedor_cuadro #contact-form button:hover,
#contenedor_adwords #contact-form button:hover
	{background:#3dcbe2;}

#contenedor_cuadro #contact-form button:active,
#contenedor_adwords #contact-form button:active
	{background-color:#e8792a;}
	
#contenedor_cuadro #contact-form button:active,
#contenedor_adwords #contact-form button:active
	{background-color:#e8792a; box-shadow:  1px 1px 0px 0px #cf6c25 inset;}