/*
 * O FROST ARBORICULTURE CSS
 *
 * @filename    styles_OF.css
 * @author      Sue Hodgetts
 * @date        30-07-2014
 * @copyright   Essential Websites
 * @url         http://www.essential-websites.com
 */

/* CSS reset */

html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote {
 padding: 0;
 margin: 0;
 font-size: 100%;
 font-weight: normal;
}
table { border-collapse: collapse; border-spacing: 0; }
td, th, caption { font-weight: normal; text-align: left; }
img, fieldset { border: 0; }
ol { padding-left: 1.4em; list-style: decimal; }
ul { padding-left: 0; }
q:before, q:after { content:''; }
a {outline: 0;}

/* end of CSS reset */


html {
	min-height: 101%;  /* FF scrollbar fix */
	}
	
body  {
	background: #fff;
	}
	
h1  {
	font-family:  "Gabriola", serif;
	font-size: 1.9em;
	color: #008000  /* titles green */;
	}

h2  {
	font-family:  "Gabriola", serif;
	font-size: 1.7em;
	color: #ef6f10 /* orange */;
	}

h3  {
	font-family:  "Gabriola", serif;
	font-size: 1.8em;
	line-height: 100%;
	text-align: center;
	color: #ef6f10 /* orange */;
	margin-bottom: 10px;
	}

h4  {
	font-family:  "Gabriola", serif;
	font-size: 1.2em;
	text-transform: uppercase;
	color: #008000  /* titles green */;
	}

h5  {
	font-family:  "Gabriola", serif;
	font-size: 1.8em;
	line-height: 100%;
	color: #ef6f10 /* orange */;
	margin-bottom: 10px;
	margin-left: 250px;
	}
	
p, a, .col2 li, .fullwidthrightbox li {
	font-family:  "Century Gothic", "Muli", Arial, sans-serif;
	font-size: 1em;
	line-height: 130%;
	padding-bottom: 15px;
	color: #4d4d4d /* text grey */;
	}


/****************/
/*   TOP BAND   */
/****************/

.topband {
	height: 55px;
	background: #ef6f10 /* orange */;
	}


/***************/
/*   WRAPPER   */
/***************/

#wrapper {
	width: 940px;
	margin: -55px auto 0 auto;
	overflow: hidden;
}


/**************/
/*   NAVBAR   */
/**************/

#home #homelink,
#consultancy #consultancylink,
#forestry #forestrylink,
#supply #supplylink,
#contact #contactlink {
	border-top: 4px solid #fff;
}

nav {
	float: right;
	width: 940px;
	height: 59px;
	margin-bottom: 20px;
}

nav ul li {
	display: inline;
	float: right;
	margin-left: 7%;
	position: relative;
	text-align: center;
}

nav ul li:last-child {
	margin-left: 0;
}

nav ul li a {
	display: block;
	font-family: "Gabriola", arial, sans-serif;
	font-size: 1.5em;
	padding-top: 9px;
	color: #fff;
	text-decoration: none;
	border-top: 4px solid #ef6f10 /* orange */;
}

nav ul li a:hover {
	border-top: 4px solid #fff;
}


/**************/
/*   BANNER   */
/**************/

.banner  {
	float: left;
	width: 940px;
	height: 140px;
	margin-bottom: 25px;
	padding-bottom: 20px;
	border-bottom: 2px solid #ddd;
	}

.logo {
	float: left;
	width: 420px;
	margin-top: 5px;
}

.telephone {
	float: right;
	width: 300px;	
	margin-top: 10px;
	text-align: right;
}

.telephone p {
	font-family:  "Gabriola", serif;
	font-size: 1.8em;
	color: #ef6f10 /* orange */;
	line-height: 110%;
}

.socialhover:hover {
	opacity: 0.8;
}

.marginright {
	margin-right: 5px;
}


/****************/
/*   SUB-MENU   */
/****************/

.submenu li a {
	display: block;
	margin-bottom: 12px;
	text-decoration: none;
	line-height: 115%;
	color: #fff;
	background: #61b161  /* mid green */;
}

.submenu li a:hover {
	opacity: 0.8;
}

.single {
	width: 185px;
	height: 35px;
	padding: 16px 0 1px 10px;
}

.double  {
	width: 185px;
	height: 45px;
	padding: 7px 0 0 10px;
}


/************/
/*   MAIN   */
/************/

.main {
	float: left;
	width: 940px;
	margin-bottom: 20px;
}

.leftbox {
	float: left;
	width: 200px;
	margin-top: 20px;
}

.rightbox {
	float: right;
	width: 700px;
}

.introbox {
	padding: 0px 80px;
	text-align: center;
	margin-bottom: 15px;
}

#forestry .introbox {
	padding: 0 60px;
}


.fullwidthbox {
	float: left;
	width: 940px;
	margin: 40px 0 10px 0;
}

.fullwidthborder {
	float: left;
	width: 940px;
	margin-bottom: 0px;
	padding-bottom: 20px;
	border-bottom: 2px solid #ddd;
}

.fullwidthrightbox {
	float: left;
	width: 700px;
	padding-top: 15px;
	padding-bottom: 30px;
	border-bottom: 2px solid #ddd;
}

.fullwidthrightbox ul {
	margin: 0 0 20px 150px;

}

.fullwidthrightbox li {
	padding-bottom: 5px;
}

.fullwidthrightbox img {
	margin-top: 10px;
	margin-bottom: 10px;
}

.marginbottom60 {
	margin-bottom: 60px;
}

.noborder {
	border: none;
}

.col1, .col2 {
	float: left;
	width: 350px;
	padding-right: 20px;
}

.col2 {
	float: right;
	width: 300px;
}

.col2 img {
	margin-top: 20px;
}

.col1 ul {
	margin-left: 30px;
	padding-right: 20px;
}

.margintop {
	margin-top: 90px;
}

.contactno {
	float: left;
	clear: both;
	width: 280px;
	padding: 5px 20px 0 20px;
	margin: 15px 60px;
	background: #fff;
}

.telno {
	font-family:  "Century Gothic", "Muli", Arial, sans-serif;
	font-size: 0.65em;
	color: #4d4d4d /* text grey */;
	margin-left: 5px;
}

.clear {
	clear: both;
}

.leftalign {
	text-align: left;
}

#contact .fullwidthrightbox {
	height: 410px;
	background: url(../images/contact_background.jpg) no-repeat center center;
}



/**************/
/*   TUMBLR   */
/**************/

.tumblr  {
	float: right;
	width: 640px;
	max-height: 120px;
	margin-bottom: 40px;
	padding: 30px;
	overflow-y: auto;
	background: #f3f3f3;
	border: 1px solid #ddd /* light grey */;
	border-bottom: none;
}

.tumblr img  {
	max-width: 260px;
	margin-bottom: 10px;
}

.tumblr p, .tumblr a, .tumblr blockquote, .tumblr_title {
	font-family:  "Century Gothic", "Muli", Arial, sans-serif;
	font-size: 0.85em;
	line-height: 130%;
	padding-bottom: 15px;
	color: #4d4d4d /* text grey */;
	border-bottom: 2px dotted #ddd /* light grey */;
	margin-bottom: 20px;
}

.tumblr_title {
	font-size: 0.9em;
	color: #666 /* dark grey */;
}

.tumblr blockquote, .tumblr a {
	border-bottom: none;
}

.tumblr blockquote  {
	padding-bottom: 0;
	margin-bottom: 0;
}

.tumblr_title {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
	font-weight: bold;
}

.tumblr a:hover {
	color: #ff6600 /* orange */;
}

.tumblr ol {
	list-style: none;  /* removes numbers from the list */
}

.scrollinstr {
	clear: both;
	float: right;
	margin-top: -30px;
	font-size: 0.85em;
}


/**************/
/*   FOOTER   */
/**************/

footer {
	height: 120px;
	padding: 40px 0 25px 0;
	background: #6e6e6e /* grey background */;
	text-align: center;
	}

footer p{
	font-family: "Gabriola", serif;
	font-size: 1.4em;
	color: #fff;
	line-height: 120%;
}

footer a {
	font-family: "Gabriola", serif;
	color: #fff;
}

footer a:hover {
	color: #ddd  /* light grey */;
}

.footerspace {
	margin: 0 20px 0 5px;
}

.footerspacelast {
	margin: 0 0 0 5px;
}


	
/*****************/
/*   WEBMASTER   */
/*****************/
	
.webmaster p {
	padding-top: 15px;
	font-family:  "century gothic", Arial, sans-serif;
 	font-size: 0.7em;
	text-align: center;
	line-height: 140%;
	}
	
 .webmaster a  {
 	font-family:  "century gothic", Arial, sans-serif;
 	text-decoration: none;
 	color: #ddd  /* light grey */;
 }
 
.webmaster a:hover  {
 	color: #fff;
 }

