@charset "UTF-8";

body {
	margin: 0; padding: 0; 
	color: #333333;
	line-height: 1.5em;
	font-family: Arial;
	font-size: 14px;
	background: #496407 url(../images/background_gradient.png) repeat-x 0px 0px;
}

.page {
	max-width: 980px;
	margin: 0px auto 0px auto;
	position: relative;
	background-color: #fff;
}


header a.logo {
	display: block;
	position: relative;
	background-position: 0px 0px;
	padding: 20px 0px 0px 0px;
	margin: 10px 0 0 0;
	background-repeat: no-repeat;
	top: 10px;
	width: 462px;
	height: 110px;
	background-image: url(../images/lyf_logo_large.png);
}
nav {
	width: 100%;
	display: block;
	position: absolute;
	background-color: #496407;
}
nav a {
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-block;
	font-weight: bold;
	font-size: .9em;
}
nav a:hover { color: #ff66ff; }
nav { top: 87px; }
nav a { margin: 12px 0px 10px 20px; }
.nav_separator {
	padding: 0px 0px 15px 15px;
	color: #ffffff;	
	font-weight: bold;
	font-size: 14px;	
	font-family: arial, sans-serif;	
}

h1 { font-size: 2em; font-weight: bold; color: #663399; margin: 0 0 .5em 0; }
h2 { font-size: 1.7em; margin: 0 0 1em 0; }
h3 { font-size: 1.5em; margin: 0 0 1em 0; }
p { margin: 0 0 .75em 0; }
a { color: #de9000; }
a:hover { color: #009eff; }

footer { font-size: .85em; color: #ffffff; background-color: #496407; padding: 10px 10px 10px 0px }

a.cta {
	text-transform: uppercase;
	font-size: .9em;
	font-weight: bold;
	text-decoration: none;
	margin: .5em 0 0 0;
	padding: 0px 0px 0px 12px;
	background: url(../images/cta_arrow.png) no-repeat left 0px;
}
a.cta:hover { background-position: left -50px; }

.promo h3 { font-size: 1.1em; margin: 0; margin-bottom: .5em; }
.promo p { line-height: 1.2em; font-size: .9em; margin-bottom: .5em; }
.promo { background-repeat: no-repeat; }
.promo.one{ background-image: url(../images/promo_1.jpg); }
.promo.two{ background-image: url(../images/promo_2.jpg); }
.promo.three{ background-image: url(../images/promo_3.jpg); }

.contact h3 { font-size: 0.9em; margin: 0; }
.contact p { line-height: 1.2em; font-size: .8em; margin-bottom: .5em; }
.contact { background-repeat: no-repeat; }
.contact.one{}
.contact.two{}
.contact.three{background-color: #fff;}

.clear-fix { clear: both; line-height: 1px; }

/***FIRST STYLE THE BUTTON***/
input#gobutton{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:5px 25px; /*add some padding to the inside of the button*/
background:#35b128; /*the colour of the button*/
border:1px solid #33842a; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
box-shadow: 0 0 4px rgba(0,0,0, .75);
/*style the text*/
color:#f3f3f3;
font-size:1.1em;
}
/***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
input#gobutton:hover, input#gobutton:focus{
background-color :#399630; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
box-shadow: 0 0 1px rgba(0,0,0, .75);
}

/* Opacity for Social Media Icon */
.img_opa {
    opacity: 0.7;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}
.img_opa:hover {
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

section {
	height: 275px;
	display: block;
	background: url(../images/banner_large.jpg) no-repeat right 0px;
}

article { padding: 60px 20px 10px 20px; }

.promo_container { padding: 0px 0px 15px 20px; }
.promo_container .promo {
	width: 33%;
	float: left;
	background-position: 0px 3px;
}
.promo_container .promo .content { padding: 0px 30px 0px 70px; }

.contact_container { padding: 0px 0px 15px 20px; }
.contact_container .contact {
	width: 33%;
	float: left;
	background-position: 0px 3px;
}
.contact_container .contact .content { padding: 0px 30px 0px 0px; }

@media screen and (max-width:990px) {
	footer { padding-left: 20px; }
}