/**
 * module.content.css 
 * CSS for the Content Pages. 
 * @author Tony Collings
 * @package SLWYKAM
 * @version 1.0 
 * @date Jan 2013
 */
 
 

/*	core.css overrides
	------------------------------------------------------------------------- */ 
	
	h1.page-title {
		margin-bottom: 40px; 	
	}
	
	div.page-content {
		padding: 20px; 	
	}

	
	/*	HOMEPAGE - index.tpl
		----------------------------------------------------------------------------------- */ 
		
		body#homepage .page-content {
			min-height: 550px; 
			text-align: center; 
			width: auto; 
		}
			#video-container {
				width: 990px; 
				height: 550px; 
				overflow: hidden; 
			}	
		

	/*

				opacity: 0.75; 
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";  
				filter: alpha(opacity=75);   					
			
		*/	
		
		
		div.random-note {
			position: absolute; 
			top: 100px; right: 10px; 
			z-index: 100; 
			width: 400px; 	
		}
		div.random-note span.note-title {font-size: 24px; line-height: 100%; display: block; clear: both; 
			color: #c0c0c0; 
		}
		div.random-note span.note-description {display: block; clear: both; margin: 10px 0px; }
		div.random-note span.note-date {display: block; clear: both; font-size: 10px; 
			color: #dedede; 
		}
		
		span.note-title a {
			color: #c0c0c0; 
			text-decoration: none; 
		}
		span.note-title a:hover {
			text-decoration: none; 	
		}


	/*	ABOUT - pages/about.tpl
		----------------------------------------------------------------------------------- */ 
		body#page-about div.page-content{

		}
		body#page-about .colgroup {
			padding: 20px 0px; 	
		}
		
		body#page-about #left-col {
			width: 450px; 
		}
		
		body#page-about #left-col img {
			width: 100%; height: auto; 	
		}

		body#page-about #right-col {
			width: 450px; 
			margin-left: 100px; 
		}
		
	
		
	
						
	/*	SERVICES - pages/services.tpl
		----------------------------------------------------------------------------------- */ 
		body#page-services div.page-content{
			width: 690px !important; 
			padding: 0px !important; 
		}
		body#page-services .colgroup {
			
		}
			
			div#services{}
			div.service{
				display: block; clear: both;
				margin-bottom: 20px; 
				padding: 20px; 	
				position: relative; 
			}
				div.service .opacity {
					width: 100%; height: 100%; 
					display: none; 
					position: absolute; top: 0px; left: 0px; 
					background-color: #000; 
					opacity: 0.8;
					z-index: -1;  	
				}
				
				div.service:hover .opacity,
				div.service.selected .opacity{
					display: block; 
				}
				div.service .thumb {
					display: inline-block; 
					width: 100px; height: 100px; 
					border: 1px solid #cdcdcd; 
					cursor:pointer; 
				}
				
				div.service:hover .thumb {
					border: 1px solid #fff; 
					-webkit-box-shadow:  0px 0px 15px 0px rgba(255, 255, 255, 0.8);
					box-shadow:  0px 0px 15px 0px rgba(255, 255, 255, 0.8);
				}
				
				div.service .meta {
					display: inline-block; 
					width: 495px; 
					margin-left: 20px; 
				}
					.meta .title {
						font-size: 28px; 
						line-height: 120%;
						cursor:pointer;  	
					}
					.meta .description {
						display: block; 
					}
		
	
	/*	WINE NOTES - pages/wine-notes.tpl 
		----------------------------------------------------------------------------------- */ 
		
		div#wine-notes{
			height: 550px; overflow: auto; 	
			-webkit-overflow-scrolling: touch;
		}
			.wine-note {
				display: block; clear: both; 
				margin-bottom: 20px; 
				padding-right: 20px; 	
			}
			.wine-note .note-title {
				font-size: 24px; 
				line-height: 130%; 
			}
			.wine-note .note-description {
				display: block; clear: both; margin: 10px 0px; 
			}
			.wine-note .note-date {
				font-size: 11px; 
				color: #808080; 
			}

	/*	BLOG POSTS - pages/blog.tpl 
		----------------------------------------------------------------------------------- */ 
		#page-blog	.wine-note .note-description p{
			display: inline-block; 
			margin: 0px 10px;  
			line-height: 100%; vertical-align: middle; 
		}
		

	/*	VIDEOS - pages/videos.tpl 
		----------------------------------------------------------------------------------- */ 
		#page-videos {}
		#video-container{width: 550px; height: auto; border: 1px solid #9d9d9d;}
		#video-gallery{width: 550px; margin: 20px 0px; }
		#video-gallery ul{display: block; width: 550px; height: auto; list-style-type: none; padding: 0px; margin: 0px; white-space:nowrap;}
		#video-gallery ul li{display: inline-block; width: 200px; height: auto;  
			margin-left: 10px; 

		}
		#video-gallery ul li:first-child{margin-left: 0px; }
		#video-gallery ul li a{display: block; width: 100%; height: 100%; border: 1px solid #9d9d9d;
			box-sizing:border-box;
			-moz-box-sizing:border-box; 
			-webkit-transition: box-shadow 500ms ease-out;
			-moz-transition: box-shadow 500ms ease-out;
			-o-transition: box-shadow 500ms ease-out;
			transition: box-shadow 500ms ease-out;				
		}
		#video-gallery ul li a:hover {
			border: 1px solid #ff8800; 	
			-webkit-box-shadow:  0px 0px 10px 0px rgba(255, 136, 0, 1);
			box-shadow:  0px 0px 10px 0px rgba(255, 136, 0, 1);				
		}
		#video-gallery ul li a img{display: block; width: 100%; height: auto; }
		
		
	/*	CONTACT - pages/contact.tpl 
		----------------------------------------------------------------------------------- */ 
		
		body#page-contact div.page-content{
			padding: 20px; 
			width: 890x;    	
		}
		
		

		form#contact{
			padding: 0px; 	
			width: 100%; 
		}
		form#contact label {
			width: 85px; 	
		}
		
		body#page-contact .form-errors{
			color: #ff8800; 
		}
		
		form#contact .form-buttons{
			text-align: right;
			width: 100%; 
		}

		
		input#cf_name,
		input#cf_email,
		textarea#cf_message{
			width: 414px; 
		}	
		input#cf_email {
			width: 392px; 	
		}
		
		
		div#success-message{
			padding: 0px;
		}
		div#success-message a {
			display: inline-block; margin: 20px 0px; 
		}	
		
		
	/*	PRIVACY POLICY - pages/privacy-policy.tpl
		----------------------------------------------------------------------------------- */ 
		body#page-privacy div.page-content{
			padding: 20px; 
		}		