/* Start of CMSMS style sheet 'Layout' */
/*
* Directory 1.0
* Copyright 2012, The Company Warehouse
* www.thecompanywarehouse.co.uk
* 07/12/2012
*/

/* Table of Content
==================================================
	
	#Icon Fonts
	#Site Styles
	#Navigation
	#Page Styles
	#Page Specific Styles
	#Media Queries */


/* #Site Styles
================================================== */
	.page-wrap { min-height: 100%; width: 980px; margin-left: auto; margin-right: auto; background-color: #fff; }
	.page { width: 980px; margin: 0 auto; overflow: visible; padding-bottom: 120px;}

	/* Section Classes */
	.block { clear: both; position: relative; width: 100%; }

/* #Navigation
================================================== */
	.nav-wrapper {
		position: relative;
		padding-bottom:10px;
		border-bottom:2px solid #015a9d;
	}	
	

/* #Page Styles
================================================== */

	/* Header */
	.header {
		background: transparent;
		clear: both;
		color: #fff;
		padding-top: 25px;
		min-height: 200px;
		width: 100%;
		position: relative;
		z-index:10;
		margin-bottom: 25px;
	}




	/* Header Contact Details */
	.address-details-wrapper {
		text-align:right;
	}		

	.contact-details, .address-details {
		color: #3d3d3d;		
		list-style: none;
		text-align: left;
		margin: 0;
		padding: 0;
		font-size: 14px;
	}
	.contact-details img {vertical-align:middle;}
	
	.contact-details a,
	.contact-details a:visited {
		color:#3d3d3d;
	}
	.contact-details a:hover {
		color:#960d11;
	}
	
	.address-details {
		text-align: right;
	}	



	/* Logo */
	.logo {
		max-width: 100%;
		height: auto;
	}	
	.logo img {width:300px;}
	
	/* Search */
	.search { position: relative; }
	.search input[type="text"], .search input[type="submit"] { max-height: 30px; }
	.search input[type="text"] { width: 100%; }
	.search input[type="image"] { background: none; border: none; padding: 7px; position: absolute; right: 0; top: 0; z-index: 100; }

	/* Footer */
	.footer-wrapper {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-top: -120px;		
	}

	.footer-wrap { clear: both; margin: 0 auto; width: 980px;  background-color: #fff;}
	.footer {
		padding-top:50px;
		text-align: center;
		font-size: 12px;
	}
	.footer > .twelve.columns {padding-top:20px;border-top:2px solid #015a9d;}
	.footer-details {text-align:left;}
	.footer-tcw-details {text-align:right;}






/* #Page Specific Styles
================================================== */

	/* Home */
	
	
	/* Featured: introtext */
	.introtext{position:absolute;top:0;left:0;bottom:0;padding:20px 20px;background-color:rgba(1, 90, 157, 0.3);color:#fff;}
	.introtext h3{font-size:26px;color:#fff;line-height:1;margin-bottom:14px;}
	.introtext p{color:#fff;margin-bottom:10px;}
	.ie .introtext{background-color:#015a9d;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";filter:alpha(opacity=30);}
	
	
	
	/* Slider & Featured */
	.home #feature-content, .home #feature-image{max-height:320px;overflow:hidden;width:100%;}
	
	
	
	.slide { height: 260px; padding: 20px; position: relative; width: 640px; }
	.slide-image { left: 170px; position: absolute; top: 45px; z-index: -1; }
	.slide-image img {width: auto; max-height: 230px;}

	/* Home - Feature Text */
	.feature-text {
		padding: 0;
	}

	
	/* Home - Addition Content Wrapper for Home */
	.additional-content-wrapper .four.columns img{		
		margin-bottom:10px;
	}




	/* Basket */
	table.faux-border { background: #ccc; width: 100%; }
	table.faux-border td { background: #fff; padding: 5px; }




/* #Media Queries
================================================== */

@media only screen and (min-width: 960px) {
		.introtext{padding-top:20px;}
		.introtext h3{font-size:26px;margin-bottom:14px;}
		.introtext p{font-size:14px;margin-bottom:10px;}

}

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {

		/* Take off the exact width specified for the page wrap and page divs and the footer */
		.page-wrap { width: 100%; }
		.page { width: 100%; }
		.footer-wrap {width: 100%; }

		/* Remove the background color from the body */
		body {
			background-color: #fff;
		}	

	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {

		.logo img {width: 236px;}
		
		.introtext{padding-top:20px;}
		.introtext h3{font-size:18px;margin-bottom:12px;}
		.introtext p{font-size:12px;margin-bottom:8px;}
		.footer-wrap { width: 768px; }

	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) { 		

		/* Hide second tier of navigation */
		.logo-wrapper {
			text-align: center;
		}
		.logo img {width:100%;}

		/* Adjust the contact details so they are aligned and spaced */
		.contact-details-wrapper {
			height: auto;
		}

		.address-details-wrapper {
			height: auto;
			text-align:center;
		}
		
		/* main content images - full width when screen small */
		.container12.add-top.add-bottom img {width:100%;}
	
	

		/* Home - Feature Text */
		.home #feature-content, .home #feature-image{max-height:none;width:100%;}
		
		/* Featured: introtext */
		.introtext{position:relative;padding:0;margin-top:10px;}
		.introtext h3{font-size:20px;color:#015a9d;}
		.introtext p{color:#000;}
		
		
		
		/* Home - Additional Columns */		
		.additional-content-wrapper .four.columns {		
			margin-bottom: 25px;
			border-bottom:2px solid #e6e6e6;
			padding:20px;
			border-left:0;
		}

		.contact-details, .address-details {
			padding-top: 10px;
			margin-top: 10px;
			border-top: 2px solid #aaa;
			text-align: center;
		}

		.address-details {
			margin: 25px 0 25px 0;			
		}

		/* Hide second tier of navigation */
		.nav ul li:hover ul { display: none; }

		/* Take out the extra height needed to position the nav to the bottom */
		.nav-wrapper { 
			min-height: 0;
		}

		/* Take out the extra height needed to position the nav to the bottom */
		.nav {
			position: static;
		}


		/* Hide feature window */
		#feature { display: none; }

		/* Update footer padding to allow for multi line text */
		.footer-wrap { width: 420px; }
		.footer { padding-top: 20px; }
		.footer-details, 
		.footer-tcw-details {text-align:center;}

	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {


		/* Centrally align the logo */
		.logo { float: none; text-align: center; }

		.footer-wrap { width: 300px; }

	}
/* End of 'Layout' */

