@import url("reset.css");
@import url("stylesheet.css");

/*---------------------------
main styles
---------------------------*/

a#skip {display:none;}
body {
	font-size: 62.5%;
	font-family: Arial, Helvetica, sans-serif;
	margin:0; background:#000 url(../images/ff-background.jpg) center top repeat-x;
}

a {text-decoration:none;color:#999;}
a:hover {text-decoration:underline;}
p {
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 9px;
	margin-left: 0;
}
li {margin-left:15px;}
.leftimgfloat, .justifyleft {
	float:left;
	margin-top: 0;
	margin-right: 20px;
	margin-bottom: 15px;
	margin-left: 0;
}
.rightimgfloat, .justifyright {float:right;margin:0 0 15px 15px;}
.small {font-size:85%;}
.red {color:#F00;}

.rightfloat {float:right;}

h1 {font-family:"LatoLight",Arial, Helvetica, sans-serif;
	font-size:220%;
	line-height:1.2;
	font-weight:normal;
	color:#000;
	padding:14px 0px 0px 30px; background:#A18335 url(../images/head-bg.jpg) repeat-x left bottom;margin:0;
	}
h1 span {background:url(../images/head-ruler.jpg) no-repeat bottom right;display:block;padding:0 20px 20px 0;}
	
h2 {font-family:"LatoRegular",Arial, Helvetica, sans-serif;font-size:160%;margin:10px 0 6px 0;font-weight:normal;color:#B69F5F;}
h3 {font-family:"LatoRegular",Arial, Helvetica, sans-serif;font-size:130%;margin:8px 0 4px 0;color:#B69F5F;font-weight:normal;}
h4 {font-family:"LatoRegular",Arial, Helvetica, sans-serif;font-size:110%;margin:10px 0 10px 0;color:#555;font-weight:normal;}

#container {width:924px;height:auto;background:#000 url(../images/border-blend.gif) repeat-x 0 0;	margin-top: 0;margin-right: auto;margin-bottom: 0px;margin-left: auto;}
#wrapper {
	font-size:1.3em;
	line-height:1.4;
	width:920px;
	height:auto;
	position:relative;
	clear:both;
	margin-top: 0;
	margin-right: 2px;
	margin-bottom: 0px;
	margin-left: 2px;
	padding:0 0 15px 0;
	background-color: #000;
}
#leftcol {float:left;width:185px;background:#000;padding-bottom:100px;text-align:center;color:#FFF;}
#leftcol p {margin:10px 5px;}
a#logo  {
	width:185px;
	height:266px;
	background-image:url(../images/fashion-factory-logo.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;display:block;cursor:pointer;
}
a#logo span {position:absolute;left:-4000px;}
#rightcol { background:#000;
	float:right;
	position:relative;
	height:auto;
	width: 735px;
	padding:0 0 50px 0;
	color:#808285;
	margin: 0px;z-index:0;
}
.beige {color:#DECC91;}
p.enquiries {margin:20px 40px 40px 40px;padding:0;}
p.enquiries a {color:#FF0099;position:relative;text-align:center;padding:5px 10px 35px 10px;display:block;background:url(../images/FashionFactory_HomePageNew_r7_c4.jpg) top center no-repeat;}
p.enquiries a:hover {text-decoration:none;color:#FFF;filter:alpha(opacity=60);-moz-opacity:.60;opacity:.60;}
#header {
	width:950px;
	height:127px;
}

#main {background:#FFF;padding:20px 230px 156px 30px;z-index:0;}
#pic1 {background:url(../images/pic1-interior.jpg) 0 0 no-repeat;width:223px;height:400px;position:absolute;right:0;top:80px;z-index:10;}
#pic2 {background:url(../images/pic2-tailoring.jpg) 0 0 no-repeat;width:223px;height:470px;position:absolute;right:0;top:80px;z-index:10;}
#pic3 {
	background: url(../images/pic3-alteration.jpg) 0 0 no-repeat;
	width: 223px;
	height: 400px;
	position: absolute;
	right: -1px;
	top: 80px;
	z-index: 10;
}
#pic4 {background:url(../images/pic4-interiors.jpg) 0 0 no-repeat;width:223px;height:400px;position:absolute;right:0;top:80px;z-index:10;}
#pic5 {background:url(../images/pic5-stockists.jpg) 0 0 no-repeat;width:223px;height:400px;position:absolute;right:0;top:80px;z-index:10;}

#slides {width:142px;height:320px;overflow:hidden;float:left;margin:0 15px 15px 0;}

#base {
	position:relative;
	clear:both;
	padding-bottom:85px;
	z-index:30;
	background-color: #000;
	background-image: url(../images/ruler-bg.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
}
.curve {position:absolute;top:-186px;left:0;width:735px;height:186px;background:url(../images/base-curve.gif) 0 0 no-repeat;z-index:20;}

.useful {
	float:left;
	width:350px;
	font-size:90%;
	margin-top: 135px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 30px;
}
.useful p {margin:0 0 2px 0;}
.contactlinks {width:300px;float:right;margin:55px 30px 0 0;color:#999;text-align:right;}
.telno {
	display:block;
	height:24px;
	background:url(../images/01484559585.gif) top right no-repeat;
	z-index: 30;
	width: auto;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 4px;
	margin-left: 0;
} 
.telno span {position:absolute;left:-4000px;}
.emails a {color:#FFF;}


#footer {clear:both;padding:20px 0 0 0;margin:0 30px 30px 30px;}
#footer p {margin:0;}
.clear {clear:both;height:0;display:block;width:100%;}

ul#icons {list-style-type:none;font-size:80%;line-height:1.1;text-align:center;height:100px;}
#icons li {float:left;width:65px;height:100px;margin:0 2px 0 0;padding:0;}
#icons li a {display:block;width:65px;height:100px;}
#icons li a:hover {text-decoration:none;color:#000;background-position:0 -3px;}

#icons li span {display:block;padding-top:67px;}
#icons li.active span {color:#FF0099;}

.icontext {width:415px;padding:25px;background:#F0F0F0 url(../images/alt-backg.jpg) 0 0 no-repeat;}

#trousers a {background:url(../images/icons_trousers.png) no-repeat;}
#jeans a {background:url(../images/icons_jeans.png) no-repeat;}
#skirts a {background:url(../images/icons_skirts.png) no-repeat;}
#dresses a {background:url(../images/icons_dresses.png) no-repeat;}
#shirts a {background:url(../images/icons_shirts.png) no-repeat;}
#jackets a {background:url(../images/icons_jackets.png) no-repeat;}
#curtains a {background:url(../images/icons_curtains.png) no-repeat;}

/*---------------------------
navigation top styles
---------------------------*/
ul#navigation {height:80px;list-style-type:none;background:#000 url(../images/menu-divider.jpg) no-repeat 0 0;padding-left:2px;}
#navigation li {font-family:"LatoBold",Arial, Helvetica, sans-serif;width:142px;height:80px;text-align:center;margin:0;float:left; background:url(../images/menu-divider.jpg) top right no-repeat;padding:0 2px 0 0;}
#navigation li a {position:relative;display:block;width:142px;height:80px;background:#000 url(../images/menu-back.jpg) 0 0 repeat-x;color:#FFF;line-height:1.1; cursor:pointer;z-index:16;}
#navigation li a:hover {background-image:none;text-decoration:none;}
#navigation li.selected a {color:#FF0099;}
#navigation li a span {position:absolute;top:0;left:0;padding:40px 5px 5px 5px;display:block;width:132px;z-index:15; }
#navigation li.selected a span {background:url(../images/needle-thread.gif) center 10px no-repeat;}

#imageslides {width:692px;height:305px;overflow:hidden;}
/*
 * jQuery Nivo Slider v2.3
 * http://nivo.dev7studios.com
 *
 * Copyright 2010, Gilbert Pellegrom
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * March 2010
 */
 
 
/* The Nivo Slider styles */
.nivoSlider {
	position:relative;
}
.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
}
/* The slices in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:50;
	height:100%;
}
.nivo-controlNav {display:none;}