body { font-family: Arial, Sans-Serif; color: #000;  font-size:16px; margin: 0; padding: 0; line-height: 1.2em;  background: #fefefe;}
a {	color: #A53512; background-color: inherit; }
a:hover { color: #000; background-color: inherit;}
.marked_green {	background: #E8F7E6; color: inherit; }
.marked_blue { background: #ECF3FB; color: inherit; }

#content { 
 width:900px;
 margin:0px auto 0px auto;
 background: White;
 border-style: solid; 
 border-width:1px;
 border-color:white #eee;
  }

#topmenu {
	margin: 110px 0px 0px 0px; 
	width:620px;
	/* background-image: url('images/menubg3.gif'); */
	background-color:#444;
	border: none;
}

nav {
	margin: 110px 0px 0px 0px; 
	width:620px;
	/* background-image: url('images/menubg3.gif'); */
	background-color:#444;
	border: none;
}


#message {  font-weight: normal; font-size:90%; margin: 110px 0 0 0; background-color: inherit;}


.right { 
	width: 620px;	
	margin: 0;	padding: 0px 0px 10px 0px; 
	float: left; 
	background: url(images/header3620.jpg) no-repeat top left;

}

.right h1 { font-size: 1.9em; letter-spacing: -1px; font-weight: normal; color: #87ABC7; color:black; background-color: inherit; font-family:Times;
	
	margin-left:10px;

}

h2{
	font-family:Trebuchet MS, Trebuchet, Arial;
	font-size:1.1em;
	color:black;
	margin-left:10px;
}

h3{
	font-family:Trebuchet MS, Trebuchet, Arial;
	font-size:1em;
	color:#2d4eab;
	margin-left:10px;
}

.right p { 
	margin-left:10px;
}

.right li { 
	margin-left:10px;
}

.right hr { 
	margin-left:10px;
}


div.adcoltoppadding {clear:both; height:100px;}


.left, aside {
	padding: 0px 10px 10px 0px; float:right; width: 250px;

}
.left p, aside p { padding: 0 0 0 10px; }
.left h1, aside h1 { font-size: 190%; letter-spacing: -1px; color: #87ABC7; margin: 10px 0 0 0; padding: 0 0 0 10px; background-color: inherit; font-family:Times;font-weight: normal;}









#logo {	
	margin-top:0px;padding-top:0px;
	margin-left:15px;
	width:150px;
	background-repeat:no-repeat;
 	border:solid 1px white;
 	} 


#logo h2 { 
	font-size: 36px;
	letter-spacing: -1px;
	font-weight: normal;
	color: #000;
	margin: 10px 0px 0px 0px; 
	padding: 0;
	background-color: inherit;
	font-family:Times;
	padding-bottom:5px;
	}
	
#logo h3{
	font-family: times new roman, serif;
 	font-style:italic;
 	font-weight:normal;
 	font-size:1.5em;
 	color:#0591d7;
	margin:0.25em 0px 0px 0px;
}


#logo p { margin: 0; padding: 3px 0 0 2px; color: #95BAE3; background-color: inherit; }



#navigation {  font-size: 90%; background: url(images/navbg.gif) repeat-x bottom left; padding: 0 0 22px 12px; }



#navigation a, span {	color: #666;	 text-decoration: none;	font-weight: bold; margin-right: 10px; padding-left: 5px;  }

#navigation ul {margin-left: 0; padding-left: 0;}
#navigation li {
	list-style-type: none; 
	border-bottom:solid 1px #eee;
}



div#navigation a:hover { 
	background-color:#f0f0f0;
	z-index:10;
	color:black;
	text-decoration: none; 
	
	

}



div.NavPaymentButton{

	margin: 10px 0px 0px 0px;

}

div.NavPaymentButton img{

	margin: 0px 0px 0px 7px;
	border:none;
}
div.NavPaymentButton.floating{
	position: fixed; z-index:1000; left: 5px; bottom: 0px
}


div.breadcrumb{
	font-size:0.8em;
	color:#555;
	padding: 0px 0px;
}

.quote { padding: 20px; background: #AC8A61 ; font-size:100%; color: #fff; }
#footer { clear:both; background: #FFF url(images/footerbg.gif) repeat-x bottom left; color: #808080; border-top: 1px solid #eee; padding: 4px 10px 4px 4px;  font-family: Verdana, "lucida console", sans-serif; letter-spacing: -1px; font-size: 0.7em; text-align: right; text-transform: uppercase; }
#footer a { color: #2980DE; background-color: inherit; }
#footer a:hover { background: #FEFDD6; color: inherit; }


footer { clear:both; background: #FFF url(images/footerbg.gif) repeat-x bottom left; color: #808080; border-top: 1px solid #eee; padding: 4px 10px 4px 4px;  font-family: Verdana, "lucida console", sans-serif; letter-spacing: -1px; font-size: 0.7em; text-align: right; text-transform: uppercase; }
footer a { color: #2980DE; background-color: inherit; }
footer a:hover { background: #FEFDD6; color: inherit; }


/*
h2{
	font-family:Times;
	font-size:1.2em;
	color:#AC8A61; 
}
*/




table{
	margin-left:1em;
	border:solid 1px silver;
	/* border-spacing:0px; */
}

td{
	border:solid 1px silver;
	margin:0px;
	padding:0.5em;
	text-align: left;
}

th{
	border:solid 1px silver;
	padding:0.5em;
	margin:0px;
}

caption 
{
	font-weight: bold; 
	text-align: left;
}


.brown{
	margin:0px; padding:0px;
	color:#d58000;
	/* was	color:#AC8A61;*/
	}

.selectedPage{

	font-weight:bold;
	text-decoration:none;
	color:#000;
	
}

.googleads{
	padding-top:1em;
	padding-left:1em;

}

.contentimage{
	border:solid 1px #e8e4d1;
	margin: 0px 0px 1em 1em; 
	padding:0.2em;
	clear:both;
	float:right;
}

h1.breadcrumbs{
	font-size:1.4em;
}

/*
 new payment button style
 */

div.singlelinepayment{
	clear:both;
	height:40px;
		border-top:solid #ccc 1px;
		border-bottom:solid #aaa 1px;

}

div.singlelinepayment table{
	float:left;
	border:none;
}

div.singlelinepayment div.price{
	display:inline;
	float:left;
	padding:0.5em; margin:0px;
	font-size:0.9em;
	/* width:410px;*/
    
}

.catalogueitemshort .singlelinepayment div.price{
	padding:0px; margin:0px;
	width:130px !important;
}


div.singlelinepayment table{
	float:left;
	border:none;
}

input.singlelinepaymentbutton{
	padding:0.5em; 
	float:right;
    
}

.catalogueItem, .news, .nodesummary{
	clear:both;
	width:560px;
	min-height:165px;
	border:solid 1px #e8e4d1;
	-moz-border-radius: 4px;border-radius: 4px;-webkit-border-radius: 4px;
	background-image:url('images/catalogueItemBg.jpg');
	margin: 1em 0.5em;
	padding:0px 1em;
}

.catalogueItem ul{
	display:block;
	margin-left:125px;
}


.catalogueItem li{
	font-size:90%;
}

/********* bookshelf **********/

.bookshelfItem{
    float:left;
	width:154px;
	border:none;
	background-image:url('images/bookshelfslice.jpg');
    background-repeat:repeat-x;
	margin: 0em;
    margin-bottom:1em;
	padding:0px 0.0em;
    text-align:center;
}
img.bookshelfthumb{
    margin:0px;
    margin-top:39px;
    margin-bottom:10px;
    padding:0px;
    border:none;
    width:125px; height:125px;
    border-right:solid 1px silver;
    border-bottom:solid 1px SaddleBrown ;
    border-top:solid 1px #888 ;
    
}
img.bookshelfthumbtall{
    margin:0px;
    margin-top:16px;
    margin-bottom:10px;
    padding:0px;
    border:none;
    width:116px; height:148px;
    border-right:solid 1px silver;
    border-bottom:solid 1px SaddleBrown;
    border-top:solid 1px #888 ;
}
.bookshelfItem h2{
	font-size:0.8em;
	color:#7e6546;
        line-height:1.2em;

}
.bookshelfItem p{
    clear:both;
	padding:0em; margin:0px;
    font-size:0.85em;
    
}
.bookshelfItem div.price{
	padding:0em; margin:0px;
    width:150px;
    font-size:0.85em;
}
 
/**********************/
/********* fibre **********/

.fibreItem{
    float:left;
	width:120px;
	border:none;
	background-image:url('images/fibreslice.jpg');
    background-repeat:repeat-x;
	margin: 0em;
    margin-bottom:2em;
    padding:0px;
    padding-top:0.5em;
    text-align:center;
    
}
img.fibrethumb{
    margin:0px;
    padding:0px;
    border:none;
    width:100px; height:100px;

    border:solid 1px;
    border-color: #888 silver silver #888;
    
}
.fibreItem h2{
	font-size:0.8em;
	color:#7e6546;
    line-height:1.2em;
    
}
.fibreItem p{
    clear:both;
	padding:0em; margin:0px;
    font-size:0.85em;
    
}
.fibreItem div.price{
	padding:0em; margin:0px;
    width:150px;
    font-size:0.85em;
}
.fibreItem table{
    margin:0px; padding:0px;
    border:none;
    text-align:center;
}
.fibreItem form{
    padding:auto;
    text-align:center;

}
.fibreItem select{
margin-left:0.8em !important;
    margin-right:1em !important;
}
    
/**********************/
/********* accessories **********/

.accessoryItem{
    float:left;
	width:154px;
	border:none;
	background-image:url('images/fibreslice.jpg');
    background-repeat:repeat-x;
	margin: 0em;
    margin-bottom:2em;
    padding:0px;
    padding-top:0.5em;
    text-align:center;
    
}
img.accessorythumb{
    margin:0px;
    padding:0px;
    border:none;
    width:100px; height:100px;
    
    border:solid 1px;
    border-color: #888 silver silver #888;
    
}
.accessoryItem h2{
	font-size:0.8em;
	color:#7e6546;
    line-height:1.2em;
    
}
.accessoryItem p{
    clear:both;
	padding:0em; margin:0px;
    font-size:0.85em;
    
}
.accessoryItem div.price{
	padding:0em; margin:0px;
    width:150px;
    font-size:0.85em;
}
.accessoryItem table{
    margin:0px; padding:0px;
    border:none;
    text-align:center;
}
.accessoryItem form{
    padding:auto;
    text-align:center;
    
}
.accessoryItem select{
    margin-left:0.8em !important;
    margin-right:1em !important;
}

/**********************/

.catalogueItem h2, 
.catalogueitemshort h2, 
.news h2,

.nodesummary h2{
	font-size:1em;
	color:#7e6546;
}

.nodesummary h3{
	font-size:0.8em;
	color:#444;
}


.catalogueItem p,
.news p,
.nodesummary p{
	font-size:0.9em;
	line-height:1.1em;
}

.catalogueitemshort p{
	font-size:0.8em;
}

.newsletter p{
	font-size:0.9em;
	line-height:1.1em;
}

.catalogueitem li{
	font-size:0.9em;
	line-height:1.1em;
}


img.thumbnail,
img.summarythumbnail{
	width:125px; height:125px;
	border:solid 1px #e8e4d1;
	margin:18px 0px 5px 10px; 
	padding:0.2em;
	float:right;
}

img.thumbnail320{
	width:320px;
	border:solid 1px #e8e4d1;
	margin:18px 0px 5px 10px; 
	padding:0.2em;
	float:none;
}

img.thumbnailirregular{
	border:solid 1px #e8e4d1;
	margin:5px; 
	padding:0.2em;
	float:none;
}

img.nodedetail{
	width:250px;
	border:none;
	margin:0em 0.5em 1em 0em; 
	padding:0.2em;
	float:right;
}

img.nodedetailsm{
	width:125px;
	border:none;
	margin:0em 0.5em 1em 0em; 
	padding:0.2em;
	float:right;
}


.paymentButton{
	clear:right;
	height:33px;
	padding-top:0.5em;
	float:right;
	
}

.paymentButton img{
	border:none;
}

div.clear{
	margin:0px; padding:0px;
	height:1px;
	clear:both;
}

div.socialnetworking{
	margin-top:1em; 
	margin-left:0.5em;
	padding:0px;
	clear:both;
}

div.giftidea{
	display:inline;
	float:left;
	margin:0px;padding:0px;
	font-size:0.9em;
}

div.giftidea img{
	margin:0px;padding:0px;
	vertical-align:middle;
}

p.OOS{
	font-size:0.9em;
	color:red;	
}

span.OOS{
	font-size:0.9em;
	color:#888;
		font-weight:normal;	
}

span.instock{
	font-weight:normal;
	font-size:0.9em;
	color:green;	
}

span.toorder{
	font-weight:normal;
	font-size:0.9em;
	color:DarkOrange;	
}

p.instock{
	font-weight:normal;
	color:green;	
}


p.smallprint{
	font-size:0.9em;
	line-height:1.1em;
}

div.hpPromoPic{
	margin:0px 0px 0px 10px;
	padding:0px;
	text-align:center;
	font-size:0.8em;
	float:left;
}

div.hpPromoPic img{
	border:none;
	border-width:0px;
}

div.footerlinks{
	margin:10px 0px 0px 0px;
	text-align:center;
	font-size:0.8em;
}



div.inlinePaymentButton{

	clear:right;
	height:30px; width:170px;
	padding-top:0.5em;
	float:right;
	
}

div.inlinePaymentPara{
	clear:both;
	font-size:0.9em;
	line-height:1.1em;
	border-top:solid 1px gray;
	margin:0.5em;
	padding:0.5em 0em 0em 0em;
	
}

div.prices{
	width:220px;
}


.catalogueitemshort .singlelinepayment{
	position:absolute;
	top:225px;
}

.catalogueitemshort .singlelinepayment .prices{
	text-align:left;
	width:135px;
}


div.inlinePaymentPara table, td, th{
	border:none;
	padding-left:0px;
	
}




.adcolumn{}

.ad,
.newsletter{
	border:solid 1px #eee;
	-moz-border-radius: 4px;border-radius: 4px;-webkit-border-radius: 4px;
	/*background-image:url('images/catalogueItemBg.jpg');*/
	margin: 1em 0em;
	padding:0px 1em;
	text-align:left;
}


.catalogueitemshort{
	position:relative;
	width:145px;
	height:290px;
	float:left;
	border:solid 1px #e8e4d1;
	background-image:url('images/catalogueItemBg.jpg');
	margin: 5px 5px 0px 0px;
	text-align:center;
}

.catalogueitemshort .thumbnail320{
	width:125px;
	margin:0px;
	float:none !important;
}

.catalogueitemshort .thumbnail{
	float:none !important;
	margin:0px !important;
}


.ad img{
	float:none !important;
}

.ad p,
.newsletter p{
	font-size:0.9em;
	line-height:1.1em;
}


form.yarncalc{
	background-image:url('images/calculatorbg.jpg');
	background-repeat:no-repeat;
	height:611px; 
	padding: 52px 33px 10px 50px;
}

.colour1{
	border-left:solid 4px red;
}
.colour2{
	border-left:solid 4px #ff4400;
}
.colour3{
	border-left:solid 4px orange;
}
.colour4{
	border-left:solid 4px #ffb400;
}
.colour5{
	border-left:solid 4px yellow;
}
.colour6{
	border-left:solid 4px #a5ff00;
}
.colour7{
	border-left:solid 4px green;
}
.colour8{
	border-left:solid 4px #009396;
}
.colour9{
	border-left:solid 4px #001f96;
}
.colour10{
	border-left:solid 4px #6900ff;
}
.colour11{
	border-left:solid 4px #5d0096;
}
.colour12{
	border-left:solid 4px #ca00ff;
}
.colour13{
	border-left:solid 4px #910096;
}
.colour14{
	border-left:solid 4px #960069;
}


/***
right menu	
***/

	ul.rightmenu, li.rightmenu {
		display:block;
		list-style:none;
	}

	ul.rightmenu {

		width:220px;
		margin:0px;
		padding:0px 0px 5px 0em;

	}

	li.rightmenu:hover {
			background:#eaeaea;
		}

	li.rightmenu {
		/*background:url(images/footerbg.gif);*/
		position:relative;
		padding:2px 20px 2px 4px;
		line-height:16px;

		border-style:solid none;
		border-color:#eee;
		border-width:1px;
		margin:1px 0px 0px 0px;
	}


	li.rightmenu a {
		color:#444;
		text-decoration:none;
		font-weight:bold;
		font-size:90%
	}

	li.rightmenu a:hover {
		color:black;
	}





/***
CSS heirarchical menu	
***/

	ul.topmenu, li.topmenu {
		display:block;
		list-style:none;
		margin:0;
		padding:0;
	}

	ul.topmenu {
		height:27px;
		width:480px;
		padding:0em 0em;
		margin:0em 0em;


	}
	ul.topmenu ul {
			position:absolute;
			left:0;
			top:24px;
			height:auto;
			width:220px;
			border-width:1px;
			border:solid 1px #666;
			border-color: #eee #999 #999 #eee;
			background-color:white;
			display:none;
		}

		ul.topmenu ul ul {
				top:0;
				left:150px;
			}




	li.topmenu:hover {
			background:#eaeaea;

			z-index:10;
		}

	li.topmenu:hover ul ul {
			display:none;
		}

	li.topmenu:hover ul, 
		li.topmenu:hover li:hover ul {
			display:block;
		}

	li.topmenu {
		position:relative;
		float:left;	
		padding:5px 20px 5px 4px;
		line-height:16px;
	}
	li.topmenu li {
			float:none;
		}

	li.topmenu a {
		color:#fff;
		text-decoration:none;
		font-weight:bold;
		font-size:90%
	}

	li.topmenu ul a {
		color:#444;
		text-decoration:none;
		font-weight:bold;
		font-size:90%
	}

	li.topmenu a:hover {
		color:black;
	}
	

.question{
	color:black;
	font-weight:normal;
	font-size:1em;	
}

input, textarea{
	margin-left:0.5em;
}

fieldset{
	background-image:url('images/catalogueItemBg.jpg');
	margin-bottom:1em;
	
	font-size:90%;
}

.agonyletter{
	margin-left:1em; margin-right:1em;
	border-top:solid 1px gray;
	border-bottom:solid 1px gray;
	font-style:italic;
}

div.sharebuttons{
	clear:both;
	font-size:90%;
	border-top:dashed silver 1px;
	padding-top:5px;
}

div.sharebuttons a{
	text-decoration:none;

}

img.sharebutton{
	border:none;
	margin:0px 2px 0px 5px;
}



div#yvonnebuttons{

	margin-bottom:0.5em;
	font-size:110%;

}

div#yvonnebuttons a{

	color:silver;
	text-decoration:none;

}

div#yvonnebuttons a:hover{

	color:black;

}



/******
new fibre listings
******/

.fibrecatalogueItem{
	clear:both;
	width:430px;
	border:solid 1px #e8e4d1;
	background-image:url('images/catalogueItemBg.jpg');
	margin: 1em 0.5em;
	padding:0px 1em;
}

.fibrecatalogueItem h2{
	font-size:1.2em;
	line-height:1.2em;
	color:#7e6546;
}

.fibrecatalogueItem p{
	font-size:0.9em;
	line-height:1.1em;
}


.fibrecatalogueItem li{
	font-size:0.9em;
	line-height:1.1em;
}

img.fibrethumbnail{
	width:60px; height:60px;
	border:solid 1px #e8e4d1;
	margin:18px 0px 5px 10px; 
	padding:0.2em;
	float:right;
}
blockquote{
	background: white;
	padding-left:1em;
	font-size:0.9em;
	font-style:italic;
}








@media only screen and (max-width:900px){

	.left, aside{
		display:none;
	}

	#content { 
		width:620px;
	}

}


/* smartphones (portrait and lanscape) */

@media only screen and (max-device-width:480px) {


	#content { 
 		width:96%;

	}

	.left, aside{
		display:none;
	}

	.right { 
		width: 100%;
		margin-left:0px;
		margin-right:0px;
	}
	
	#topmenu {
		width:100%;
		margin-left:0px;
		margin-right:0px;
	}

	nav {
		width:100%;
		margin-left:0px;
		margin-right:0px;
	}

	.catalogueItem, .news, .nodesummary{
		width:92%;
		margin-left:auto;
		margin-right:auto;

	}

	.pmlinks{

		display:none;

	}

}


/* iPhone 4 (portrait) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */

	#content { 
 		width:320px;
		font-size:12px;
	}

	img.thumbnail,
	img.summarythumbnail{
		width:90px; height:90px;
		margin:9px 0px 3px 5px; 
		padding:0.1em;
		float:right;
	}
	
	.catalogueItem, .news, .nodesummary{
		padding:0px 0.5em;
	}


}

/* iPhone 5 (portrait) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */

	#content { 
 		width:320px;
		font-size:12px;
	}

	img.thumbnail,
	img.summarythumbnail{
		width:90px; height:90px;
		margin:9px 0px 3px 5px; 
		padding:0.1em;
		float:right;
	}
	
	.catalogueItem, .news, .nodesummary{
		padding:0px 0.5em;
	}

}


/* iPhone 6 (portrait) ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */


	#content { 
 		width:375px;
		font-size:12px;
	}

	img.thumbnail,
	img.summarythumbnail{
		width:90px; height:90px;
		margin:9px 0px 3px 5px; 
		padding:0.1em;
		float:right;
	}
	
	.catalogueItem, .news, .nodesummary{
		padding:0px 0.5em;
	}

}