html {
	padding: 0;
	margin: 0;
}

body {
	background: #242424 none;
	color: #fff;
	font-family: "museo", serif;
	font-weight: 400;
	font-size: 14px;
	padding: 0;
	margin: 0;
}

/* ------
 | Header
 | ------
 */

h1 {
	background: transparent url(../images/home/header-right.png) scroll no-repeat right bottom;;
	color: #ace14b;
	font-family: LibraBT-Regular, serif;
	font-size: 40px;
	font-weight: normal;
	text-align: right;
	padding: 16px 39px 0 0;
	margin: 0;
	width: 251px;
	height: 96px;
	position: absolute;
	top: 0;
	right: 0;
}

#header {
	background: transparent url(../images/home/header-centre.gif) scroll repeat-x left 104px;
	margin: 0 290px -4px 0;
	height: 141px;
}

#header-content {
	background: transparent url(../images/home/header-left.png) scroll no-repeat left top;
	width: 300px;
	height: 141px;
}

/* -------
 | Content
 | -------
 */

a {
	background: transparent none;
	color: #fff;
	text-decoration: none;
}

a:hover,
a:active {
	text-decoration: underline;
}

h2 {
	font-size: 32px;
	font-weight: 400;
	padding: 0;
	margin: 0;
}

p {
	padding: 0;
	margin: 0;
}

#content {
	background: #8ac72e url(../images/home/background.jpg);
	color: #b9f150;
	text-align: center;
	max-width: 1402px;
	margin: 0 auto;
	position: relative;
}

/* -------
 | Contact
 | -------
 */

button {
	background: transparent url(../images/home/button.png) scroll no-repeat left top;
	color: #fff;
	font-family: "museo", serif;
	font-weight: 400;
	cursor: pointer;
	padding: 0;
	border: none;
	margin: 0 0 0 2px;
	width: 63px;
	height: 88px;
}

input,
textarea {
	background: #def7af none;
	color: #5d4c6a;
	font-family: "Gochi Hand", sans-serif;
	font-size: 22px;
	line-height: 26px;
	padding: 0;
	border: none;
	margin: 0 0 2px;
	width: 317px;
	height: 26px;
	position: relative;
	z-index: 1;
}

textarea {
	font-size: 22px;
	line-height: 20px;
	width: 251px;
	height: 87px;
	resize: vertical;
	float: left;
}

label {
	display: block;
	font-size: 14px;
	line-height: 26px;
	padding-left: 8px;
	margin-bottom: -26px;
	float: left;
	position: relative;
	z-index: 2;
}

#contact {
	padding: 41px 0 41px 7%;
	margin: 0 auto;
	width: 317px;
	clear: both;
}

#contact form,
#thanks {
	margin-top: 17px;
}

#contact h2 {
	font-size: 14px;
}

#contact h2 span {
	cursor: pointer;
}

#contact h2 span:hover {
	color: #def7ae;
}

#contact.expanded h2 {
	color: #def7ae;
}

#contact label {
	background: transparent none;
	color: #a8cc68;
	font-weight: 300;
}

#contact p {
	text-align: left;
}

#contact #back {
	text-align: center;
	padding-top: 24px;
	clear: left;
}

#preview {
	background: rgba(221,248,176,0.5) none;
	color: #5f4e6c;
	font-family: "Gochi Hand", sans-serif;
	font-size: 22px;
	line-height: 20px;
	margin: 0 0 2px;
	width: 251px;
	float: left;
}

#contact #preview-message {
	font-size: 20px;
	text-align: center;
	padding: 24px 0;
}

#contact #thanks-message {
	font-size: 20px;
	text-align: center;
	padding-top: 24px;
}

#thanks-message.error {
	background: transparent none;
	color: #f65656;
}

/* -----
 | Bella
 | -----
 */

#bella {
	width: 48%;
	margin-left: 7%;
	float: left;
}

#bella a:hover,
#bella a:active {
	text-decoration: none;
}

#bella h2 {
	font-size: 24px;
}

#bella h2 strong {
	font-size: 32px;
}

#bella img {
	margin: 5px 0 8px;
	width: 82%;
}

#bella p a:hover,
#bella p a:active {
	text-decoration: underline;
}

#bella strong {
	font-weight: 400;
}

#bella-hover {
  -moz-transition-property: opacity;
  -webkit-transition-property: opacity;
  -ms-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
  
  -moz-transition-timing-function: ease-in-out;
  -webkit-transition-timing-function: ease-in-out;
  -ms-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  
  -moz-transition-duration: 0.5s;
  -webkit-transition-duration: 0.5s;
  -ms-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  
	position: absolute;
	opacity: 0;
}

#bella a:hover #bella-hover {
  -moz-transition-property: opacity;
  -webkit-transition-property: opacity;
  -ms-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
  
  -moz-transition-timing-function: ease-in-out;
  -webkit-transition-timing-function: ease-in-out;
  -ms-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  
  -moz-transition-duration: 0.5s;
  -webkit-transition-duration: 0.5s;
  -ms-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  
	opacity: 1;
}

/* --
 | F1
 | --
 */

#f1 {
	width: 45%;
	overflow: hidden;
	float: right;
}

#f1 a:hover,
#f1 a:active {
	text-decoration: none;
}

#f1 img {
  -moz-transition-property: margin-right;
  -webkit-transition-property: margin-right;
  -ms-transition-property: margin-right;
  -o-transition-property: margin-right;
  transition-property: margin-right;
  
  -moz-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  -webkit-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  -ms-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  -o-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  
  -moz-transition-duration: 0.5s;
  -webkit-transition-duration: 0.5s;
  -ms-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  
	width: 99%;
	margin: 10px -74% 24px 0;
}


#f1 a:hover img,
#f1 a:active img {
  -moz-transition-property: margin-right;
  -webkit-transition-property: margin-right;
  -ms-transition-property: margin-right;
  -o-transition-property: margin-right;
  transition-property: margin-right;
  
  -moz-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  -webkit-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  -ms-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  -o-transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  transition-timing-function: cubic-bezier(0.42, 0, 0.1, 1.0);
  
  -moz-transition-duration: 0.5s;
  -webkit-transition-duration: 0.5s;
  -ms-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  
	margin-right: 0;
}

/* -------------
 | Small screens
 | -------------
 */

@media (max-width: 600px) {
	#bella,
	#f1 {
		margin-left: 5%;
		width: 95%;
	}
	
	#bella {
		margin-bottom: 41px;
	}
}

@media (max-width: 590px) {
	h1 {
		background: transparent url(../images/home/header-centre.gif) scroll repeat-x left bottom;
	}
}


@media (max-width: 500px) {
	h1 {
		background-image: none;
		height: 154px;
	}
	
	#header {
		background: transparent url(../images/home/header-centre.gif) scroll repeat-x left 162px;
		height: 201px;
		margin-right: 0;
	}
	
	#header-content {
		background: transparent url(../images/home/header-left-tall.png) scroll repeat-x left bottom;
		height: 201px;
	}
}

@media (max-width: 340px) {
	#contact {
		padding-left: 0;
	}
}