@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Lato:300);

/* CSS styles for CIAO */

/* Mobile Styles*/


@media only screen and (min-width : 641px) and (max-width : 2560px) {
html body {
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	margin: 0;
	padding: 0;
	
}
#wrap{
	margin-top:0;
	margin-left:auto;
	margin-right:auto;
	
}
header{
	float:left;
	width:100%;
	position:relative;
	background-color: #f2f2f3;

	max-height:320px;
	}
	

#ciao-logo{
	float:left;
/*	width:320px;*/
	margin-left:38%;
	border-color:10px solid white;
}
#ciao-logo img{
	width:100%;
	max-height:320px;
	max-width:340px;
	border-color:10px solid white;
	
}

#brand-statement{
	float:left;
	height:400px;
	font-size:16px;
	background-color:#666666;
	color:#FFFFFF;
	padding-top: 43px;
	padding-left: 20%;
	padding-right:20%;
	padding-bottom:45px;
	margin-top:10px;
	line-height: 26px;
}
#arrow{
	margin-left: 46%;
	margin-top: 14%;
}
#contact-section{
	background-color:#f15f22;
	color:#FFFFFF;
	float:left;
	margin-top:10px;
	
	width: 100%;
}
#contact-statement{
	float:left;
	padding-left: 20%;
	width:19%;
}
#contact-statement h1{
	font-size:60px;
	margin-bottom: 10px;
}
#contact-statement p{
	margin-bottom:5px;
	margin-top:5px;
	margin-top: 0px;
}
#contact-statement p:nth-child(4n+1){
	
	margin-top:15px;
}

#contact-area {
	float: left;
	width: 450px;
	padding: 10px;
	margin: 10px;
	float: left;
	margin-top: 40px;
}
#contact-area label{
	width:20%;
}
#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 430px;
	font-family: 'Lato', sans-serif;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 5px solid #ffffff;
}
#contact-area textarea {
	height: 90px;
}
#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #900;
}
#contact-area input.submit-button {
	width: 100%;
	float:left;
	background-color:#f15f22;
	color:#ffffff;
	
	}
#contact-area input.submit-button:hover{
		background-color:#e95212;
		color:#ffffff;
}
#contact-area p a{
	text-decoration:none;
	color:#ffffff;
	font-size:18px;
	padding:5px;
	border:1px solid #ffffff;
}
#contact-area p a:hover{
	text-decoration:none;
	color:#e95212;
	font-size:18px;
}
#contact-area h1{
	padding-left:20px;
}
footer {
	padding-top:30px;
	float:left;
	width:100%;
	text-align:center;
	color:#ffffff;
	background-color:#f15f22;
}
footer p{
	width:85%;
	font-size:10px;
	padding-left:10%;
}
}

@media only screen and (min-width : 20px) and (max-width : 640px) {
/* Styles */
html body {
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	margin: 0;
	padding: 0;
	}
#wrap{
	min-width:320px;
}
header{
	float:left;
	width:100%;
	position:relative;
	background-color: #f2f2f3;
	}
	

#ciao-logo{
	float:left;
	margin-left:25%;
}

#ciao-logo img{
	width:100%;
	/*max-height:175x;*/
	max-width:175px;
	margin:-3px;
}
#brand-statement{
	float:left;
	background-color:#666666;
	color:#FFFFFF;
	font-size:16px;
	padding-top: 43px;
	padding-right:5%;
	padding-left:5%;
	padding-bottom:45px;
	margin-top:10px;
	line-height: 26px;

	
}
#arrow{
	margin-left: 40%;
}


#contact-section{
	background-color:#f15f22;
	color:#FFFFFF;
	float:left;
	margin-top:10px;
	width: 100%;
}
#contact-statement{
	float:left;
	padding-left:5%;
	width: 85%;

}
#contact-statement h1{
	font-size:60px;
	margin-bottom: 10px;
}
#contact-area {
	float: left;
	width: 85%;
	padding: 10px;
	margin: 10px;
	float: left;
}

#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 95%;
	font-family: 'Lato', sans-serif;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 5px solid #ffffff;
}
#contact-area textarea {
	height: 90px;
}
#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #900;
}
#contact-area input.submit-button {
	width: 100%;
	float: left;
	color:#ffffff;
	background-color:#f15f22;
	
}
#contact-area input.submit-button:hover{
		background-color:#e95212;
		color:#ffffff;
}
#contact-area p a{
	text-decoration:none;
	color:#ffffff;
	font-size:18px;
	padding:5px;
	border:1px solid #ffffff;
}
#contact-area p a:hover{
	text-decoration:none;
	color:#e95212;
	font-size:18px;
}
#contact-area h1{
	padding-left:20px;
}
footer {
	float:left;
	
	width:100%;
	color:#ffffff;
	background-color:#f15f22;
}
footer p{
	padding-left:5%;
	width:90%;
	font-size:10px;
}

}