/*
Name: Styles.css
Site Name: 1stepahead
Description: CSS Framework main page
Author: Angus Maclean
Version: 1.0

Table Of Contents
   1- Imports
   2- Container
   3- Links
   4- Headers
   5- Header
   6- Navigation
   7- Main
   8- Forms
   9- Footer
  10- Everything else
*/

/*  1 Imports
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
@import url("reset.css");
@import url('global.css');
@import url('fonts.css');

/*  2 Container
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
body {
	background-color:#cccccc;
}
#container {
	position:relative;
	margin:0 auto;
	width: 940px;
}

/*  3 Links
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
a:link {
	color:#ff0099;
}
a:visited {
}
a:active {
}
a:hover {
}

/*  4 Headers
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 
h1 { 
}
h2 { 
}
h3 { 
}
h4 { 
}
h5 { 
}
h6 { 
}
p {
	color:#FFFFFF;
}
/*  5 Header
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#header {
	position:absolute;
	left:20px;
	top:30px;
	width:900px;
	height:130px;
	background-color:#A7BD00;
	background:url(../images/header.jpg) no-repeat;
}
#header2 {
	position:absolute;
	left:20px;
	top:30px;
	width:900px;
	height:130px;
	background-color:#A7BD00;
	background:url(../images/header2.jpg) no-repeat;
}
#header3 {
	position:absolute;
	left:20px;
	top:30px;
	width:900px;
	height:130px;
	background-color:#A7BD00;
	background:url(../images/header3.jpg) no-repeat;
}
#logo {
	margin-left:50px;
	margin-top:7px;
}
/*  6 Navigation
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#nav {
	position:absolute;
	left:20px;
	top:160px;
	width:900px;
	height:35px;
	background-color:#FF0099;
}
#nav ul li{
	float:left;
	display:block;
}
#link1 a{
	width:80px;
	height:35px;
	display:block;
	text-indent:-9999px;
	background:url(../images/link1.jpg) no-repeat;
}
#link1 a:hover {
	background-position:bottom;
}
#link2 a{
	width:120px;
	height:35px;
	display:block;
	text-indent:-9999px;
	background:url(../images/link2.jpg) no-repeat;
}
#link2 a:hover {
	background-position:bottom;
}
#link3 a{
	width:150px;
	height:35px;
	display:block;
	text-indent:-9999px;
	background:url(../images/link3.jpg) no-repeat;
}
#link3 a:hover {
	background-position:bottom;
}
#link4 a{
	width:170px;
	height:35px;
	display:block;
	text-indent:-9999px;
	background:url(../images/link4.jpg) no-repeat;
}
#link4 a:hover {
	background-position:bottom;
}
#link5 a{
	width:240px;
	height:35px;
	display:block;
	text-indent:-9999px;
	background:url(../images/link5.jpg) no-repeat;
}
#link5 a:hover {
	background-position:bottom;
}
#link6 a{
	width:140px;
	height:35px;
	display:block;
	text-indent:-9999px;
	background:url(../images/link6.jpg) no-repeat;
}
#link6 a:hover {
	background-position:bottom;
}
/*  7 Main
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#picture {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/back2school.jpg) no-repeat;
}
#picture_brands {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/summer_sale.jpg) no-repeat;
}
#picture_pre_walkers {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/baby_feet2.jpg) no-repeat;
}
#picture_school_shoes {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/school.jpg) no-repeat;
}
#picture_fitting {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background: url(../images/baby_feet.jpg) no-repeat;
}
#picture_contact {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/hopscotch.jpg) no-repeat;
}
#picture_xmas {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/xmas.jpg) no-repeat;
}
#picture_spring {
	position:absolute;
	left:20px;
	top:195px;
	width:900px;
	height:315px;
	background:url(../images/spring.jpg) no-repeat;
}
#main {
	position:absolute;
	left:20px;
	top:510px;
	width:900px;
	height:360px;
	background:#270C73;
}
#address {
	width:880px;
	height:104px;
	margin-left:20px;
	margin-top:10px;
	margin-bottom:16px;
	padding-top:6px;
	background:url(../images/address_bg.jpg) no-repeat;
}
.address_map {
	float:left;
	width:169px;
	margin-left:5px;
	-margin-left:4px;
	color:#fff;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	line-height:18px;
	letter-spacing:1px;
}
.map_link{
	position: relative;
	top:5px;
	left:80px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
a.map_link {
	color:#FFFFFF;
}
#home_text {
	float:left;
	width:600px;
	margin-left:20px;
	-margin-left:10px;
}
#home_text h2 {
	height:35px;
	width:600px;
	margin-bottom:10px;
	text-indent:-9999px;
	background:url(../images/newshop.jpg) no-repeat;
}
#home_text p{
	float:left;
	width:600px;
	margin-bottom:10px;
	font-family: “Trebuchet MS”, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: normal;
	text-transform: normal;
	line-height: 1.2em;
	color:#cccccc;
}
#home_brands {
	position:absolute;
	top:135px;
	left:640px;
}
#school_shoes_h2 {
	height:35px;
	width:860px;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:20px;
	text-indent:-9999px;
	background:url(../images/school_shoes_h2.jpg) no-repeat;
}
.full_width_p {
	width:860px;
	margin-left:20px;
	margin-bottom:20px;
	font-family: “Trebuchet MS”, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: normal;
	text-transform: normal;
	line-height: 1.2em;
	color:#ffffff;
}
.full_width_p_smaller {
	width:800px;
	margin-left:20px;
	margin-bottom:20px;
	font-family: “Trebuchet MS”, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: normal;
	text-transform: normal;
	line-height: 1.2em;
	color:#ffffff;
}
#fitting_h2 {
	height:35px;
	width:860px;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:20px;
	text-indent:-9999px;
	background:url(../images/fitting_h2.jpg) no-repeat;
}
#brands_h2 {
	height:35px;
	width:860px;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:30px;
	text-indent:-9999px;
	background:url(../images/brands_h2.jpg) no-repeat;
}
#brand_logos {
	float:left;
	width:606px;
	margin-left:20px;	
}
#brand_text {
	float:left;
	width:240px;
	margin-left:20px;
	margin-top:10px;
	font-family: “Trebuchet MS”, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: normal;
	text-transform: normal;
	line-height: 1.2em;
	color:#ffffff;	
}
#brand_text p{
	margin-bottom:20px;
}
#pre_walkers_h2 {
	height:35px;
	width:860px;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:20px;
	text-indent:-9999px;
	background:url(../images/pre_walkers_h2.jpg) no-repeat;
}
/*  8 Forms
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#contact_form_name {
	position:absolute;
	top:150px;
	left:500px;
	color:#FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	letter-spacing:1px;	
}
#contact_form_name_box {
	position:absolute;
	top:150px;
	left:640px;
	background-color:#ECECE2;	
}
#contact_form_email {
	position:absolute;
	top:185px;
	left:500px;
	color:#FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	letter-spacing:1px;
}
#contact_form_email_box {
	position:absolute;
	top:185px;
	left:640px;
	background-color:#ECECE2;
}
#contact_form_message {
	position:absolute;
	top:220px;
	left:500px;
	color:#FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	letter-spacing:1px;	
}
#contact_form_message_box {
	position:absolute;
	top:220px;
	left:640px;
	width:233px;
	background-color:#ECECE2;
}
#contact_form_submit {
	position:absolute;
	top:315px;
	left:815px;
	width:63px;
}
#h2_mailsent {
	margin-left:20px;
	margin-top:20px;
	font-family: “Trebuchet MS”, sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: bold;
	text-transform: normal;
	color:#ffffff;
}
/*  9 Footer
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 
 #footer {
	position:absolute;
	left:20px;
	top:870px;
	width:900px;
	height:50px;
	padding-top:10px;
	text-align:left;

	background-color:#A7BD00;
}
#footer p{
	color:#270C73;
}
/* 10 Everything else
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#leftshadow {
	position:absolute;
	left:0px;
	top:0px;
	width:20px;
	height:960px;
	background:url(../images/left_shadow.jpg) no-repeat;
}
#topshadow {
	position:absolute;
	left:20px;
	top:0px;
	width:900px;
	height:30px;
	background:url(../images/top_shadow.jpg) no-repeat;
}
#rightshadow {
	position:absolute;
	left:920px;
	top:0px;
	width:20px;
	height:960px;
	background:url(../images/right_shadow.jpg) no-repeat;
}
#bottomshadow {
	position:absolute;
	left:20px;
	top:930px;
	width:900px;
	height:30px;
	background:url(../images/bottom_shadow.jpg) no-repeat;
}
.map {
	float:left;
	width:586px;
	margin-top:30px;
	margin-left:20px;
	border:#FF0099 solid 5px;
}
#map1 {
	position:absolute;
	top:93px;
	left:90px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
#map2 {
	position:absolute;
	top:93px;
	left:270px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
#map3 {
	position:absolute;
	top:93px;
	left:450px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
#map4 {
	position:absolute;
	top:93px;
	left:630px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
#map5 {
	position:absolute;
	top:93px;
	left:810px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
.address_map2 {
	float:right;
	width:250px;
	margin-top:30px;
	color:#FFFFFF;
	font-weight:bold;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	letter-spacing:1px;
	line-height:20px;
}
#contact_text {
	float: left;
	width:450px;
	margin-left:20px;
	margin-top:10px;
font-family: “Trebuchet MS”, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: normal;
text-transform: normal;
line-height: 1.2em;
color:#cccccc;
	clear:both;
}
#contact_text p{
	margin-bottom:15px;
}
#contact_text a {
	color:#ff0099;
}
#btnUp{
	position:absolute;
	top:70px;
	left:840px;
	width:40px;
	height:60px;
	background:url(../images/up.jpg) no-repeat;
	display:block;
	text-indent:-9999px;
}
#btnDown{
	position:absolute;
	top:280px;
	left:840px;
	width:40px;
	height:60px;
	background:url(../images/down.jpg) no-repeat;
	display:block;
	text-indent:-9999px;
}
#btnReset {
	position:absolute;
	text-indent:-9999px;
}	
#vvv {
	width:820px;
}
