/* CSS Document */


#bienvenido {
    width: 1080px;
    height: 549px;
    margin: 100px auto 0 auto;
    clear: both;
    padding-top: 280px;  
}

#bienvenido img {
    float: left;
    margin: 0 0 0 45px
}

#bienvenido-info {
    width: 562px;
    height: 390px;
    float: left;
    margin: 55px 0 0 45px;
}

#bienvenido h2 {
    color: #80B93F;
}

#bienvenido h3 {
    color: #299ED5;
    margin-top: -25px;
}

#bienvenido p {
    color: #777777;
    margin-top: -10px;
}

#bienvenido a {
    margin: 20px 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    text-decoration: none;
    color: white;
    background: #299ED5;
    padding: 13px 20px 13px 20px;
    float: left;
    border-radius: 40px;
    transition: background 0.3s ease-in;
}

#bienvenido a:hover {
    background: #2FB5EA;  
}


#numeros {
    width: 100%;
    height: 516px;
    background: url(../images/back-mundo.jpg);   
}

#numeros-dentro {
    width: 1080px;
    height: 516px;
    margin: auto;
    text-align: center;
}

#numeros-dentro h2 {
    color: white;
    margin-top: 49px;
    display: inline-block;
}

#numeros-dentro h3 {
    color: #299ED5;
    margin-top: -23px;
}

#numeros-dentro p {
    width: 890px;
    text-align: center;
    color: white;
    margin: -3px 90px;
}

#numeros-dentro img {
    margin-top: 50px;   
}

#numeros-dentro a {
    display: inline-block;
    margin-top: 40px;
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    text-decoration: none;
    color: white;
    background: #299ED5;
    padding: 13px 20px 13px 20px;
    border-radius: 40px;
    transition: background 0.3s ease-in;
}

#numeros-dentro a:hover {
    background: #2FB5EA;  
}



#comunicate-inicio {
    width: 1080px;
    height: 550px;
    margin: auto;
}

#comunicate-info {
    width: 517px;
    height: 460px;
    float: left;
}

#comunicate-info h2 {
    color: #80B93F;
}

#comunicate-info h3 {
    color: #299ED5;
    margin-top: -25px;
}

#comunicate-info p {
    color: #777777;
}

.info-info {
    width: 517px;
    height: 60px;
}

.info-info p {
    width: 300px;
    height:50px;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;   
    color: #777777;
    margin: -30px 0 0 20px; 
    display: inline-block;
}

.info-info p {
    
}

.info-info img {
    margin-top: 10px;   
}


.contact_form ul {
    width:500px;
    float: left;
    list-style-type:none;
	list-style-position:outside;
	margin: 80px 0 0 40px;
	padding:0px;
}

.contact_form li{
	padding:12px; 
	position:relative;
} 

/* === Form Elements === */

.contact_form input {
	height:38px; 
	width:300px; 
	padding:5px 8px;
    border: none;
    background: url(../images/back-input.png);
    font-family: cursive;
    font-size: 22px;
    margin-top: -5px;
}

#inp1 {
    background: url(../images/inp1.png);   
}

#inp2 {
    background: url(../images/inp2.png);   
}

.contact_form textarea {
    padding:8px; 
    width: 382px;
    font-family: cursive;
    font-size: 22px;
    background: url(../images/back-textarea.png) left top no-repeat;
    border: none;
}

	/* form element visual styles */
	.contact_form input, .contact_form textarea { 
		border-radius:2px;
		padding-right:30px;
		-moz-transition: padding .25s; 
		-webkit-transition: padding .25s; 
		-o-transition: padding .25s;
		transition: padding .25s;
            color: #299ED5;
	}

	.contact_form input:focus { 
		padding-right:70px;
        border: none;
        box-shadow: none;
	}


/* === Form hints === */
.form_hint {
	background: #299ED5;
	border-radius: 3px 3px 3px 3px;
	color: white;
	margin-left:8px;
	padding: 1px 6px;
	z-index: 999; /* hints stay above all other elements */
	position: absolute; /* allows proper formatting if hint is two lines */
	display: none;
    font-size: 15px;
}

.form_hint::before {
	content: "\25C0";
	color:#299ED5;
	position: absolute;
	top:1px;
	left:-6px;
}

.contact_form input:focus + .form_hint {display: inline;}
.contact_form input:required:valid + .form_hint {background: #299ED5;}
.contact_form input:required:valid + .form_hint::before {color:#28921f;}

button.submit { 
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    color: white;
    background: #299ED5;
    padding: 10px 28px 10px 28px;
    transition: background 0.3s ease-in;
    border-radius: 40px;
}

button.submit:hover {
    background: #2FB5EA;     
}